/* Copyright 2014 Mozilla Foundation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.messageBar {
    --closing-button-icon: url(images/messageBar_closingButton.svg);
    --message-bar-close-button-color: var(--text-primary-color);
    --message-bar-close-button-color-hover: var(--text-primary-color);
    --message-bar-close-button-border-radius: 4px;
    --message-bar-close-button-border: none;
    --csstools-light-dark-toggle--0: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.14);
    --message-bar-close-button-hover-bg-color: var(--csstools-light-dark-toggle--0, rgb(21 20 26 / 0.14));
    --csstools-light-dark-toggle--1: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.21);
    --message-bar-close-button-active-bg-color: var(--csstools-light-dark-toggle--1, rgb(21 20 26 / 0.21));
    --csstools-light-dark-toggle--2: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.07);
    --message-bar-close-button-focus-bg-color: var(--csstools-light-dark-toggle--2, rgb(21 20 26 / 0.07));
}

@supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)) {
    .messageBar {
        --message-bar-close-button-hover-bg-color: light-dark( rgb(21 20 26 / 0.14), rgb(251 251 254 / 0.14) );
        --message-bar-close-button-active-bg-color: light-dark( rgb(21 20 26 / 0.21), rgb(251 251 254 / 0.21) );
        --message-bar-close-button-focus-bg-color: light-dark( rgb(21 20 26 / 0.07), rgb(251 251 254 / 0.07) );
    }
}

@supports not (color: light-dark(tan, tan)) {

    .messageBar * {
        --csstools-light-dark-toggle--0: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.14);
        --message-bar-close-button-hover-bg-color: var(--csstools-light-dark-toggle--0, rgb(21 20 26 / 0.14));
        --csstools-light-dark-toggle--1: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.21);
        --message-bar-close-button-active-bg-color: var(--csstools-light-dark-toggle--1, rgb(21 20 26 / 0.21));
        --csstools-light-dark-toggle--2: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.07);
        --message-bar-close-button-focus-bg-color: var(--csstools-light-dark-toggle--2, rgb(21 20 26 / 0.07));
    }
}

@media screen and (forced-colors: active) {

    .messageBar {
        --message-bar-close-button-color: ButtonText;
        --message-bar-close-button-border: 1px solid ButtonText;
        --message-bar-close-button-hover-bg-color: ButtonText;
        --message-bar-close-button-active-bg-color: ButtonText;
        --message-bar-close-button-focus-bg-color: ButtonText;
        --message-bar-close-button-color-hover: HighlightText;
    }
}

.messageBar {
    display: flex;
    position: relative;
    padding: 8px 8px 8px 16px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border-radius: 4px;
    border: 1px solid var(--message-bar-border-color);
    background: var(--message-bar-bg-color);
    color: var(--message-bar-fg-color);
}

    .messageBar > div {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        align-self: stretch;
    }

:is(.messageBar > div)::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    -webkit-mask-image: var(--message-bar-icon);
    mask-image: var(--message-bar-icon);
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--message-bar-icon-color);
    flex-shrink: 0;
}

.messageBar button {
    cursor: pointer;
}

:is(.messageBar button):focus-visible {
    outline: var(--focus-ring-outline);
    outline-offset: 2px;
}

.messageBar .closeButton {
    width: 32px;
    height: 32px;
    background: none;
    border-radius: var(--message-bar-close-button-border-radius);
    border: var(--message-bar-close-button-border);
    display: flex;
    align-items: center;
    justify-content: center;
}

:is(.messageBar .closeButton)::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    -webkit-mask-image: var(--closing-button-icon);
    mask-image: var(--closing-button-icon);
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--message-bar-close-button-color);
}

:is(.messageBar .closeButton):is(:hover,:active,:focus)::before {
    background-color: var(--message-bar-close-button-color-hover);
}

:is(.messageBar .closeButton):hover {
    background-color: var(--message-bar-close-button-hover-bg-color);
}

:is(.messageBar .closeButton):active {
    background-color: var(--message-bar-close-button-active-bg-color);
}

:is(.messageBar .closeButton):focus {
    background-color: var(--message-bar-close-button-focus-bg-color);
}

:is(.messageBar .closeButton) > span {
    display: inline-block;
    width: 0;
    height: 0;
    overflow: hidden;
}

#editorUndoBar {
    --csstools-light-dark-toggle--3: var(--csstools-color-scheme--light) #fbfbfe;
    --text-primary-color: var(--csstools-light-dark-toggle--3, #15141a);
    --message-bar-icon: url(images/messageBar_info.svg);
    --csstools-light-dark-toggle--4: var(--csstools-color-scheme--light) #73a7f3;
    --message-bar-icon-color: var(--csstools-light-dark-toggle--4, #0060df);
    --csstools-light-dark-toggle--5: var(--csstools-color-scheme--light) #003070;
    --message-bar-bg-color: var(--csstools-light-dark-toggle--5, #deeafc);
    --message-bar-fg-color: var(--text-primary-color);
    --csstools-light-dark-toggle--6: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
    --message-bar-border-color: var(--csstools-light-dark-toggle--6, rgb(0 0 0 / 0.08));
    --csstools-light-dark-toggle--7: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
    --undo-button-bg-color: var(--csstools-light-dark-toggle--7, rgb(21 20 26 / 0.07));
    --csstools-light-dark-toggle--8: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.14);
    --undo-button-bg-color-hover: var(--csstools-light-dark-toggle--8, rgb(21 20 26 / 0.14));
    --csstools-light-dark-toggle--9: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.21);
    --undo-button-bg-color-active: var(--csstools-light-dark-toggle--9, rgb(21 20 26 / 0.21));
    --csstools-light-dark-toggle--10: var(--csstools-color-scheme--light) #0df;
    --undo-button-border: 1px solid var(--csstools-light-dark-toggle--10, #0060df);
    --undo-button-fg-color: var(--message-bar-fg-color);
    --undo-button-fg-color-hover: var(--undo-button-fg-color);
    --undo-button-fg-color-active: var(--undo-button-fg-color);
}

@supports (color: light-dark(red, red)) {
    #editorUndoBar {
        --text-primary-color: light-dark(#15141a, #fbfbfe);
        --message-bar-icon-color: light-dark(#0060df, #73a7f3);
        --message-bar-bg-color: light-dark(#deeafc, #003070);
    }
}

@supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)) {
    #editorUndoBar {
        --message-bar-border-color: light-dark( rgb(0 0 0 / 0.08), rgb(255 255 255 / 0.08) );
        --undo-button-bg-color: light-dark( rgb(21 20 26 / 0.07), rgb(255 255 255 / 0.08) );
        --undo-button-bg-color-hover: light-dark( rgb(21 20 26 / 0.14), rgb(255 255 255 / 0.14) );
        --undo-button-bg-color-active: light-dark( rgb(21 20 26 / 0.21), rgb(255 255 255 / 0.21) );
    }
}

@supports (color: light-dark(red, red)) {
    #editorUndoBar {
        --undo-button-border: 1px solid light-dark(#0060df, #0df);
    }
}

@supports not (color: light-dark(tan, tan)) {

    #editorUndoBar * {
        --csstools-light-dark-toggle--3: var(--csstools-color-scheme--light) #fbfbfe;
        --text-primary-color: var(--csstools-light-dark-toggle--3, #15141a);
        --csstools-light-dark-toggle--4: var(--csstools-color-scheme--light) #73a7f3;
        --message-bar-icon-color: var(--csstools-light-dark-toggle--4, #0060df);
        --csstools-light-dark-toggle--5: var(--csstools-color-scheme--light) #003070;
        --message-bar-bg-color: var(--csstools-light-dark-toggle--5, #deeafc);
        --csstools-light-dark-toggle--6: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
        --message-bar-border-color: var(--csstools-light-dark-toggle--6, rgb(0 0 0 / 0.08));
        --csstools-light-dark-toggle--7: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
        --undo-button-bg-color: var(--csstools-light-dark-toggle--7, rgb(21 20 26 / 0.07));
        --csstools-light-dark-toggle--8: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.14);
        --undo-button-bg-color-hover: var(--csstools-light-dark-toggle--8, rgb(21 20 26 / 0.14));
        --csstools-light-dark-toggle--9: var(--csstools-color-scheme--light) rgb(255 255 255 / 0.21);
        --undo-button-bg-color-active: var(--csstools-light-dark-toggle--9, rgb(21 20 26 / 0.21));
        --csstools-light-dark-toggle--10: var(--csstools-color-scheme--light) #0df;
        --undo-button-border: 1px solid var(--csstools-light-dark-toggle--10, #0060df);
    }
}

@media screen and (forced-colors: active) {

    #editorUndoBar {
        --text-primary-color: CanvasText;
        --message-bar-icon-color: CanvasText;
        --message-bar-bg-color: Canvas;
        --message-bar-border-color: CanvasText;
        --undo-button-bg-color: ButtonText;
        --undo-button-bg-color-hover: SelectedItem;
        --undo-button-bg-color-active: SelectedItem;
        --undo-button-fg-color: ButtonFace;
        --undo-button-fg-color-hover: SelectedItemText;
        --undo-button-fg-color-active: SelectedItemText;
        --undo-button-border: none;
    }
}

#editorUndoBar {
    position: fixed;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    padding-block: 8px;
    padding-inline: 16px 8px;
    font: menu;
    font-size: 15px;
    cursor: default;
}

    #editorUndoBar button {
        cursor: pointer;
    }

    #editorUndoBar #editorUndoBarUndoButton {
        border-radius: 4px;
        font-weight: 590;
        line-height: 19.5px;
        color: var(--undo-button-fg-color);
        border: var(--undo-button-border);
        padding: 4px 16px;
        margin-inline-start: 8px;
        height: 32px;
        background-color: var(--undo-button-bg-color);
    }

:is(#editorUndoBar #editorUndoBarUndoButton):hover {
    background-color: var(--undo-button-bg-color-hover);
    color: var(--undo-button-fg-color-hover);
}

:is(#editorUndoBar #editorUndoBarUndoButton):active {
    background-color: var(--undo-button-bg-color-active);
    color: var(--undo-button-fg-color-active);
}

#editorUndoBar > div {
    align-items: center;
}

.textLayer {
    position: absolute;
    text-align: initial;
    inset: 0;
    overflow: clip;
    opacity: 1;
    line-height: 1;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    text-size-adjust: none;
    forced-color-adjust: none;
    transform-origin: 0 0;
    caret-color: CanvasText;
    z-index: 0;
}

    .textLayer.highlighting {
        touch-action: none;
    }

    .textLayer :is(span,br) {
        color: transparent;
        position: absolute;
        white-space: pre;
        cursor: text;
        transform-origin: 0% 0%;
    }

    .textLayer > :not(.markedContent), .textLayer .markedContent span:not(.markedContent) {
        z-index: 1;
    }

    .textLayer span.markedContent {
        top: 0;
        height: 0;
    }

    .textLayer span[role="img"] {
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        cursor: default;
    }

    .textLayer .highlight {
        --highlight-bg-color: rgb(180 0 170 / 0.25);
        --highlight-selected-bg-color: rgb(0 100 0 / 0.25);
        --highlight-backdrop-filter: none;
        --highlight-selected-backdrop-filter: none;
    }

@media screen and (forced-colors: active) {

    .textLayer .highlight {
        --highlight-bg-color: transparent;
        --highlight-selected-bg-color: transparent;
        --highlight-backdrop-filter: var(--hcm-highlight-filter);
        --highlight-selected-backdrop-filter: var( --hcm-highlight-selected-filter );
    }
}

.textLayer .highlight {
    margin: -1px;
    padding: 1px;
    background-color: var(--highlight-bg-color);
    -webkit-backdrop-filter: var(--highlight-backdrop-filter);
    backdrop-filter: var(--highlight-backdrop-filter);
    border-radius: 4px;
}

.appended:is(.textLayer .highlight) {
    position: initial;
}

.begin:is(.textLayer .highlight) {
    border-radius: 4px 0 0 4px;
}

.end:is(.textLayer .highlight) {
    border-radius: 0 4px 4px 0;
}

.middle:is(.textLayer .highlight) {
    border-radius: 0;
}

.selected:is(.textLayer .highlight) {
    background-color: var(--highlight-selected-bg-color);
    -webkit-backdrop-filter: var(--highlight-selected-backdrop-filter);
    backdrop-filter: var(--highlight-selected-backdrop-filter);
}

.textLayer ::-moz-selection {
    background: rgba(0 0 255 / 0.25);
    background: color-mix(in srgb, AccentColor, transparent 75%);
}

.textLayer ::selection {
    background: rgba(0 0 255 / 0.25);
    background: color-mix(in srgb, AccentColor, transparent 75%);
}

.textLayer br::-moz-selection {
    background: transparent;
}

.textLayer br::selection {
    background: transparent;
}

.textLayer .endOfContent {
    display: block;
    position: absolute;
    inset: 100% 0 0;
    z-index: 0;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.textLayer.selecting .endOfContent {
    top: 0;
}

.annotationLayer {
    --csstools-color-scheme--light: initial;
    color-scheme: only light;
    --annotation-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
    --input-focus-border-color: Highlight;
    --input-focus-outline: 1px solid Canvas;
    --input-unfocused-border-color: transparent;
    --input-disabled-border-color: transparent;
    --input-hover-border-color: black;
    --link-outline: none;
}

@media screen and (forced-colors: active) {

    .annotationLayer {
        --input-focus-border-color: CanvasText;
        --input-unfocused-border-color: ActiveText;
        --input-disabled-border-color: GrayText;
        --input-hover-border-color: Highlight;
        --link-outline: 1.5px solid LinkText;
    }

        .annotationLayer .textWidgetAnnotation :is(input,textarea):required, .annotationLayer .choiceWidgetAnnotation select:required, .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input:required {
            outline: 1.5px solid selectedItem;
        }

        .annotationLayer .linkAnnotation {
            outline: var(--link-outline);
        }

    :is(.annotationLayer .linkAnnotation):hover {
        -webkit-backdrop-filter: var(--hcm-highlight-filter);
        backdrop-filter: var(--hcm-highlight-filter);
    }

    :is(.annotationLayer .linkAnnotation) > a:hover {
        opacity: 0 !important;
        background: none !important;
        box-shadow: none;
    }

    .annotationLayer .popupAnnotation .popup {
        outline: calc(1.5px * var(--total-scale-factor)) solid CanvasText !important;
        background-color: ButtonFace !important;
        color: ButtonText !important;
    }

    .annotationLayer .highlightArea:hover::after {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-backdrop-filter: var(--hcm-highlight-filter);
        backdrop-filter: var(--hcm-highlight-filter);
        content: "";
        pointer-events: none;
    }

    .annotationLayer .popupAnnotation.focused .popup {
        outline: calc(3px * var(--total-scale-factor)) solid Highlight !important;
    }
}

.annotationLayer {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    transform-origin: 0 0;
}

    .annotationLayer[data-main-rotation="90"] .norotate {
        transform: rotate(270deg) translateX(-100%);
    }

    .annotationLayer[data-main-rotation="180"] .norotate {
        transform: rotate(180deg) translate(-100%, -100%);
    }

    .annotationLayer[data-main-rotation="270"] .norotate {
        transform: rotate(90deg) translateY(-100%);
    }

    .annotationLayer.disabled section, .annotationLayer.disabled .popup {
        pointer-events: none;
    }

    .annotationLayer .annotationContent {
        position: absolute;
        width: 100%;
        height: 100%;
        pointer-events: none;
    }

.freetext:is(.annotationLayer .annotationContent) {
    background: transparent;
    border: none;
    inset: 0;
    overflow: visible;
    white-space: nowrap;
    font: 10px sans-serif;
    line-height: 1.35;
}

.annotationLayer section {
    position: absolute;
    text-align: initial;
    pointer-events: auto;
    box-sizing: border-box;
    transform-origin: 0 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

:is(.annotationLayer section):has(div.annotationContent) canvas.annotationContent {
    display: none;
}

:is(.annotationLayer section) .overlaidText {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    display: inline-block;
    overflow: hidden;
}

.textLayer.selecting ~ .annotationLayer section {
    pointer-events: none;
}

.annotationLayer :is(.linkAnnotation,.buttonWidgetAnnotation.pushButton) > a {
    position: absolute;
    font-size: 1em;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.annotationLayer :is(.linkAnnotation,.buttonWidgetAnnotation.pushButton):not(.hasBorder) > a:hover {
    opacity: 0.2;
    background-color: rgb(255 255 0);
}

.annotationLayer .linkAnnotation.hasBorder:hover {
    background-color: rgb(255 255 0 / 0.2);
}

.annotationLayer .hasBorder {
    background-size: 100% 100%;
}

.annotationLayer .textAnnotation img {
    position: absolute;
    cursor: pointer;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.annotationLayer .textWidgetAnnotation :is(input,textarea), .annotationLayer .choiceWidgetAnnotation select, .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input {
    background-image: var(--annotation-unfocused-field-background);
    border: 2px solid var(--input-unfocused-border-color);
    box-sizing: border-box;
    font: calc(9px * var(--total-scale-factor)) sans-serif;
    height: 100%;
    margin: 0;
    vertical-align: top;
    width: 100%;
}

    .annotationLayer .textWidgetAnnotation :is(input,textarea):required, .annotationLayer .choiceWidgetAnnotation select:required, .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input:required {
        outline: 1.5px solid red;
    }

    .annotationLayer .choiceWidgetAnnotation select option {
        padding: 0;
    }

.annotationLayer .buttonWidgetAnnotation.radioButton input {
    border-radius: 50%;
}

.annotationLayer .textWidgetAnnotation textarea {
    resize: none;
}

.annotationLayer .textWidgetAnnotation [disabled]:is(input,textarea), .annotationLayer .choiceWidgetAnnotation select[disabled], .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input[disabled] {
    background: none;
    border: 2px solid var(--input-disabled-border-color);
    cursor: not-allowed;
}

.annotationLayer .textWidgetAnnotation :is(input,textarea):hover, .annotationLayer .choiceWidgetAnnotation select:hover, .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input:hover {
    border: 2px solid var(--input-hover-border-color);
}

.annotationLayer .textWidgetAnnotation :is(input,textarea):hover, .annotationLayer .choiceWidgetAnnotation select:hover, .annotationLayer .buttonWidgetAnnotation.checkBox input:hover {
    border-radius: 2px;
}

.annotationLayer .textWidgetAnnotation :is(input,textarea):focus, .annotationLayer .choiceWidgetAnnotation select:focus {
    background: none;
    border: 2px solid var(--input-focus-border-color);
    border-radius: 2px;
    outline: var(--input-focus-outline);
}

.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) :focus {
    background-image: none;
    background-color: transparent;
}

.annotationLayer .buttonWidgetAnnotation.checkBox :focus {
    border: 2px solid var(--input-focus-border-color);
    border-radius: 2px;
    outline: var(--input-focus-outline);
}

.annotationLayer .buttonWidgetAnnotation.radioButton :focus {
    border: 2px solid var(--input-focus-border-color);
    outline: var(--input-focus-outline);
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before, .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after, .annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {
    background-color: CanvasText;
    content: "";
    display: block;
    position: absolute;
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before, .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {
    height: 80%;
    left: 45%;
    width: 1px;
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before {
    transform: rotate(45deg);
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after {
    transform: rotate(-45deg);
}

.annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before {
    border-radius: 50%;
    height: 50%;
    left: 25%;
    top: 25%;
    width: 50%;
}

.annotationLayer .textWidgetAnnotation input.comb {
    font-family: monospace;
    padding-left: 2px;
    padding-right: 0;
}

    .annotationLayer .textWidgetAnnotation input.comb:focus {
        width: 103%;
    }

.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.annotationLayer .fileAttachmentAnnotation .popupTriggerArea {
    height: 100%;
    width: 100%;
}

.annotationLayer .popupAnnotation {
    position: absolute;
    font-size: calc(9px * var(--total-scale-factor));
    pointer-events: none;
    width: -moz-max-content;
    width: max-content;
    max-width: 45%;
    height: auto;
}

.annotationLayer .popup {
    background-color: rgb(255 255 153);
    color: black;
    box-shadow: 0 calc(2px * var(--total-scale-factor)) calc(5px * var(--total-scale-factor)) rgb(136 136 136);
    border-radius: calc(2px * var(--total-scale-factor));
    outline: 1.5px solid rgb(255 255 74);
    padding: calc(6px * var(--total-scale-factor));
    cursor: pointer;
    font: message-box;
    white-space: normal;
    word-wrap: break-word;
    pointer-events: auto;
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text;
}

.annotationLayer .popupAnnotation.focused .popup {
    outline-width: 3px;
}

.annotationLayer .popup * {
    font-size: calc(9px * var(--total-scale-factor));
}

.annotationLayer .popup > .header {
    display: inline-block;
}

    .annotationLayer .popup > .header > .title {
        display: inline;
        font-weight: bold;
    }

    .annotationLayer .popup > .header .popupDate {
        display: inline-block;
        margin-left: calc(5px * var(--total-scale-factor));
        width: -moz-fit-content;
        width: fit-content;
    }

.annotationLayer .popupContent {
    border-top: 1px solid rgb(51 51 51);
    margin-top: calc(2px * var(--total-scale-factor));
    padding-top: calc(2px * var(--total-scale-factor));
}

.annotationLayer .richText > * {
    white-space: pre-wrap;
    font-size: calc(9px * var(--total-scale-factor));
}

.annotationLayer .popupTriggerArea {
    cursor: pointer;
}

:is(.annotationLayer .popupTriggerArea):hover {
    -webkit-backdrop-filter: var(--hcm-highlight-filter);
    backdrop-filter: var(--hcm-highlight-filter);
}

.annotationLayer section svg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.annotationLayer .annotationTextContent {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none;
}

:is(.annotationLayer .annotationTextContent) span {
    width: 100%;
    display: inline-block;
}

.annotationLayer svg.quadrilateralsContainer {
    contain: strict;
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

:root {
    --xfa-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
    --xfa-focus-outline: auto;
}

@media screen and (forced-colors: active) {
    :root {
        --xfa-focus-outline: 2px solid CanvasText;
    }

    .xfaLayer *:required {
        outline: 1.5px solid selectedItem;
    }
}

.xfaLayer {
    --csstools-color-scheme--light: initial;
    color-scheme: only light;
    background-color: transparent;
}

    .xfaLayer .highlight {
        margin: -1px;
        padding: 1px;
        background-color: rgb(239 203 237);
        border-radius: 4px;
    }

        .xfaLayer .highlight.appended {
            position: initial;
        }

        .xfaLayer .highlight.begin {
            border-radius: 4px 0 0 4px;
        }

        .xfaLayer .highlight.end {
            border-radius: 0 4px 4px 0;
        }

        .xfaLayer .highlight.middle {
            border-radius: 0;
        }

        .xfaLayer .highlight.selected {
            background-color: rgb(203 223 203);
        }

.xfaPage {
    overflow: hidden;
    position: relative;
}

.xfaContentarea {
    position: absolute;
}

.xfaPrintOnly {
    display: none;
}

.xfaLayer {
    position: absolute;
    text-align: initial;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    line-height: 1.2;
}

    .xfaLayer * {
        color: inherit;
        font: inherit;
        font-style: inherit;
        font-weight: inherit;
        font-kerning: inherit;
        letter-spacing: -0.01px;
        text-align: inherit;
        text-decoration: inherit;
        box-sizing: border-box;
        background-color: transparent;
        padding: 0;
        margin: 0;
        pointer-events: auto;
        line-height: inherit;
    }

        .xfaLayer *:required {
            outline: 1.5px solid red;
        }

    .xfaLayer div,
    .xfaLayer svg,
    .xfaLayer svg * {
        pointer-events: none;
    }

    .xfaLayer a {
        color: blue;
    }

.xfaRich li {
    margin-left: 3em;
}

.xfaFont {
    color: black;
    font-weight: normal;
    font-kerning: none;
    font-size: 10px;
    font-style: normal;
    letter-spacing: 0;
    text-decoration: none;
    vertical-align: 0;
}

.xfaCaption {
    overflow: hidden;
    flex: 0 0 auto;
}

.xfaCaptionForCheckButton {
    overflow: hidden;
    flex: 1 1 auto;
}

.xfaLabel {
    height: 100%;
    width: 100%;
}

.xfaLeft {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.xfaRight {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}

:is(.xfaLeft, .xfaRight) > :is(.xfaCaption, .xfaCaptionForCheckButton) {
    max-height: 100%;
}

.xfaTop {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.xfaBottom {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
}

:is(.xfaTop, .xfaBottom) > :is(.xfaCaption, .xfaCaptionForCheckButton) {
    width: 100%;
}

.xfaBorder {
    background-color: transparent;
    position: absolute;
    pointer-events: none;
}

.xfaWrapped {
    width: 100%;
    height: 100%;
}

:is(.xfaTextfield, .xfaSelect):focus {
    background-image: none;
    background-color: transparent;
    outline: var(--xfa-focus-outline);
    outline-offset: -1px;
}

:is(.xfaCheckbox, .xfaRadio):focus {
    outline: var(--xfa-focus-outline);
}

.xfaTextfield,
.xfaSelect {
    height: 100%;
    width: 100%;
    flex: 1 1 auto;
    border: none;
    resize: none;
    background-image: var(--xfa-unfocused-field-background);
}

.xfaSelect {
    padding-inline: 2px;
}

:is(.xfaTop, .xfaBottom) > :is(.xfaTextfield, .xfaSelect) {
    flex: 0 1 auto;
}

.xfaButton {
    cursor: pointer;
    width: 100%;
    height: 100%;
    border: none;
    text-align: center;
}

.xfaLink {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.xfaCheckbox,
.xfaRadio {
    width: 100%;
    height: 100%;
    flex: 0 0 auto;
    border: none;
}

.xfaRich {
    white-space: pre-wrap;
    width: 100%;
    height: 100%;
}

.xfaImage {
    -o-object-position: left top;
    object-position: left top;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.xfaLrTb,
.xfaRlTb,
.xfaTb {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.xfaLr {
    display: flex;
    flex-direction: row;
    align-items: stretch;
}

.xfaRl {
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
}

.xfaTb > div {
    justify-content: left;
}

.xfaPosition {
    position: relative;
}

.xfaArea {
    position: relative;
}

.xfaValignMiddle {
    display: flex;
    align-items: center;
}

.xfaTable {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

    .xfaTable .xfaRow {
        display: flex;
        flex-direction: row;
        align-items: stretch;
    }

    .xfaTable .xfaRlRow {
        display: flex;
        flex-direction: row-reverse;
        align-items: stretch;
        flex: 1;
    }

        .xfaTable .xfaRlRow > div {
            flex: 1;
        }

:is(.xfaNonInteractive, .xfaDisabled, .xfaReadOnly) :is(input, textarea) {
    background: initial;
}

@media print {
    .xfaTextfield,
    .xfaSelect {
        background: transparent;
    }

    .xfaSelect {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        text-indent: 1px;
        text-overflow: "";
    }
}

.canvasWrapper svg {
    transform: none;
}

.moving:is(.canvasWrapper svg) {
    z-index: 100000;
}

[data-main-rotation="90"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) mask, [data-main-rotation="90"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) use:not(.clip,.mask) {
    transform: matrix(0, 1, -1, 0, 1, 0);
}

[data-main-rotation="180"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) mask, [data-main-rotation="180"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) use:not(.clip,.mask) {
    transform: matrix(-1, 0, 0, -1, 1, 1);
}

[data-main-rotation="270"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) mask, [data-main-rotation="270"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) use:not(.clip,.mask) {
    transform: matrix(0, -1, 1, 0, 0, 1);
}

.draw:is(.canvasWrapper svg) {
    position: absolute;
    mix-blend-mode: normal;
}

.draw[data-draw-rotation="90"]:is(.canvasWrapper svg) {
    transform: rotate(90deg);
}

.draw[data-draw-rotation="180"]:is(.canvasWrapper svg) {
    transform: rotate(180deg);
}

.draw[data-draw-rotation="270"]:is(.canvasWrapper svg) {
    transform: rotate(270deg);
}

.highlight:is(.canvasWrapper svg) {
    --blend-mode: multiply;
}

@media screen and (forced-colors: active) {

    .highlight:is(.canvasWrapper svg) {
        --blend-mode: difference;
    }
}

.highlight:is(.canvasWrapper svg) {
    position: absolute;
    mix-blend-mode: var(--blend-mode);
}

    .highlight:is(.canvasWrapper svg):not(.free) {
        fill-rule: evenodd;
    }

.highlightOutline:is(.canvasWrapper svg) {
    position: absolute;
    mix-blend-mode: normal;
    fill-rule: evenodd;
    fill: none;
}

.highlightOutline.hovered:is(.canvasWrapper svg):not(.free):not(.selected) {
    stroke: var(--hover-outline-color);
    stroke-width: var(--outline-width);
}

.highlightOutline.selected:is(.canvasWrapper svg):not(.free) .mainOutline {
    stroke: var(--outline-around-color);
    stroke-width: calc( var(--outline-width) + 2 * var(--outline-around-width) );
}

.highlightOutline.selected:is(.canvasWrapper svg):not(.free) .secondaryOutline {
    stroke: var(--outline-color);
    stroke-width: var(--outline-width);
}

.highlightOutline.free.hovered:is(.canvasWrapper svg):not(.selected) {
    stroke: var(--hover-outline-color);
    stroke-width: calc(2 * var(--outline-width));
}

.highlightOutline.free.selected:is(.canvasWrapper svg) .mainOutline {
    stroke: var(--outline-around-color);
    stroke-width: calc( 2 * (var(--outline-width) + var(--outline-around-width)) );
}

.highlightOutline.free.selected:is(.canvasWrapper svg) .secondaryOutline {
    stroke: var(--outline-color);
    stroke-width: calc(2 * var(--outline-width));
}

.toggle-button {
    --button-background-color: color-mix(in srgb, currentColor 7%, transparent);
    --button-background-color-hover: color-mix( in srgb, currentColor 14%, transparent );
    --button-background-color-active: color-mix( in srgb, currentColor 21%, transparent );
    --csstools-light-dark-toggle--35: var(--csstools-color-scheme--light) #0df;
    --color-accent-primary: var(--csstools-light-dark-toggle--35, #0060df);
    --csstools-light-dark-toggle--36: var(--csstools-color-scheme--light) #80ebff;
    --color-accent-primary-hover: var(--csstools-light-dark-toggle--36, #0250bb);
    --csstools-light-dark-toggle--37: var(--csstools-color-scheme--light) #aaf2ff;
    --color-accent-primary-active: var(--csstools-light-dark-toggle--37, #054096);
    --border-radius-circle: 9999px;
    --border-width: 1px;
    --size-item-small: 16px;
    --size-item-large: 32px;
    --csstools-light-dark-toggle--38: var(--csstools-color-scheme--light) #1c1b22;
    --color-canvas: var(--csstools-light-dark-toggle--38, white);
    --background-color-canvas: var(--color-canvas);
    --csstools-light-dark-toggle--39: var(--csstools-color-scheme--light) #f9f9fa;
    --border-color-interactive: var(--csstools-light-dark-toggle--39, #8f8f9d);
    --border-color-interactive-hover: var(--border-color-interactive);
    --border-color-interactive-active: var(--border-color-interactive);
}

@supports (color: light-dark(red, red)) {
    .toggle-button {
        --color-accent-primary: light-dark(#0060df, #0df);
        --color-accent-primary-hover: light-dark(#0250bb, #80ebff);
        --color-accent-primary-active: light-dark(#054096, #aaf2ff);
        --color-canvas: light-dark(white, #1c1b22);
        --border-color-interactive: light-dark(#8f8f9d, #f9f9fa);
    }
}

@supports not (color: light-dark(tan, tan)) {

    .toggle-button * {
        --csstools-light-dark-toggle--35: var(--csstools-color-scheme--light) #0df;
        --color-accent-primary: var(--csstools-light-dark-toggle--35, #0060df);
        --csstools-light-dark-toggle--36: var(--csstools-color-scheme--light) #80ebff;
        --color-accent-primary-hover: var(--csstools-light-dark-toggle--36, #0250bb);
        --csstools-light-dark-toggle--37: var(--csstools-color-scheme--light) #aaf2ff;
        --color-accent-primary-active: var(--csstools-light-dark-toggle--37, #054096);
        --csstools-light-dark-toggle--38: var(--csstools-color-scheme--light) #1c1b22;
        --color-canvas: var(--csstools-light-dark-toggle--38, white);
        --csstools-light-dark-toggle--39: var(--csstools-color-scheme--light) #f9f9fa;
        --border-color-interactive: var(--csstools-light-dark-toggle--39, #8f8f9d);
    }
}

@media (forced-colors: active) {

    .toggle-button {
        --color-accent-primary: ButtonText;
        --color-accent-primary-hover: SelectedItem;
        --color-accent-primary-active: SelectedItem;
        --button-background-color: ButtonFace;
        --border-color-interactive: ButtonText;
        --border-color-interactive-hover: SelectedItem;
        --border-color-interactive-active: ButtonText;
        --color-canvas: ButtonText;
        --background-color-canvas: Canvas;
    }
}

.toggle-button {
    --toggle-background-color: var(--button-background-color);
    --toggle-background-color-hover: var(--button-background-color-hover);
    --toggle-background-color-active: var(--button-background-color-active);
    --toggle-background-color-pressed: var(--color-accent-primary);
    --toggle-background-color-pressed-hover: var(--color-accent-primary-hover);
    --toggle-background-color-pressed-active: var(--color-accent-primary-active);
    --toggle-border-color: var(--border-color-interactive);
    --toggle-border-color-hover: var(--toggle-border-color);
    --toggle-border-color-active: var(--toggle-border-color);
    --toggle-border-radius: var(--border-radius-circle);
    --toggle-border-width: var(--border-width);
    --toggle-height: var(--size-item-small);
    --toggle-width: var(--size-item-large);
    --toggle-dot-background-color: var(--toggle-border-color);
    --toggle-dot-background-color-hover: var(--toggle-dot-background-color);
    --toggle-dot-background-color-active: var(--toggle-dot-background-color);
    --toggle-dot-background-color-on-pressed: var(--background-color-canvas);
    --toggle-dot-margin: 1px;
    --toggle-dot-height: calc( var(--toggle-height) - 2 * var(--toggle-dot-margin) - 2 * var(--toggle-border-width) );
    --toggle-dot-width: var(--toggle-dot-height);
    --toggle-dot-transform-x: calc( var(--toggle-width) - 4 * var(--toggle-dot-margin) - var(--toggle-dot-width) );
    --input-width: var(--toggle-width);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: var(--toggle-border-width) solid var(--toggle-border-color);
    height: var(--toggle-height);
    width: var(--toggle-width);
    border-radius: var(--toggle-border-radius);
    background-color: var(--toggle-background-color);
    box-sizing: border-box;
}

    .toggle-button:focus-visible {
        outline: var(--focus-outline);
        outline-offset: var(--focus-outline-offset);
    }

    .toggle-button:enabled:hover {
        background-color: var(--toggle-background-color-hover);
        border-color: var(--toggle-border-color);
    }

        .toggle-button:enabled:hover:active {
            background-color: var(--toggle-background-color-active);
            border-color: var(--toggle-border-color);
        }

    .toggle-button::before {
        display: block;
        content: "";
        background-color: var(--toggle-dot-background-color);
        height: var(--toggle-dot-height);
        width: var(--toggle-dot-width);
        margin: var(--toggle-dot-margin);
        border-radius: var(--toggle-border-radius);
        translate: 0;
    }

    .toggle-button[aria-pressed="true"] {
        background-color: var(--toggle-background-color-pressed);
        border-color: transparent;
    }

        .toggle-button[aria-pressed="true"]:enabled:hover {
            background-color: var(--toggle-background-color-pressed-hover);
            border-color: transparent;
        }

            .toggle-button[aria-pressed="true"]:enabled:hover:active {
                background-color: var(--toggle-background-color-pressed-active);
                border-color: transparent;
            }

        .toggle-button[aria-pressed="true"]::before {
            translate: var(--toggle-dot-transform-x);
            background-color: var(--toggle-dot-background-color-on-pressed);
        }

        .toggle-button[aria-pressed="true"]:enabled:hover::before, .toggle-button[aria-pressed="true"]:enabled:hover:active::before {
            background-color: var(--toggle-dot-background-color-on-pressed);
        }

        .toggle-button[aria-pressed="true"]:-moz-locale-dir(rtl)::before, [dir="rtl"] .toggle-button[aria-pressed="true"]::before {
            translate: calc(-1 * var(--toggle-dot-transform-x));
        }

@media (prefers-reduced-motion: no-preference) {
    .toggle-button::before {
        transition: translate 100ms;
    }
}

@media (prefers-contrast) {
    .toggle-button:enabled:hover {
        border-color: var(--toggle-border-color-hover);
    }

        .toggle-button:enabled:hover:active {
            border-color: var(--toggle-border-color-active);
        }

    .toggle-button[aria-pressed="true"]:enabled {
        border-color: var(--toggle-border-color);
        position: relative;
    }

        .toggle-button[aria-pressed="true"]:enabled:hover {
            border-color: var(--toggle-border-color-hover);
        }

            .toggle-button[aria-pressed="true"]:enabled:hover:active {
                background-color: var(--toggle-dot-background-color-active);
                border-color: var(--toggle-dot-background-color-hover);
            }

    .toggle-button:enabled:hover::before,
    .toggle-button:enabled:hover:active::before {
        background-color: var(--toggle-dot-background-color-hover);
    }
}

@media (forced-colors) {
    .toggle-button {
        --toggle-dot-background-color: var(--color-accent-primary);
        --toggle-dot-background-color-hover: var(--color-accent-primary-hover);
        --toggle-dot-background-color-active: var(--color-accent-primary-active);
        --toggle-dot-background-color-on-pressed: var(--button-background-color);
        --toggle-border-color-hover: var(--border-color-interactive-hover);
        --toggle-border-color-active: var(--border-color-interactive-active);
    }

        .toggle-button[aria-pressed="true"]:enabled::after {
            border: 1px solid var(--button-background-color);
            content: "";
            position: absolute;
            height: var(--toggle-height);
            width: var(--toggle-width);
            display: block;
            border-radius: var(--toggle-border-radius);
            inset: -2px;
        }

        .toggle-button[aria-pressed="true"]:enabled:hover:active::after {
            border-color: var(--toggle-border-color-active);
        }
}

:root {
    --clear-signature-button-icon: url(images/editor-toolbar-delete.svg);
    --csstools-light-dark-toggle--40: var(--csstools-color-scheme--light) #2b2a33;
    --signature-bg: var(--csstools-light-dark-toggle--40, #f9f9fb);
    --csstools-light-dark-toggle--41: var(--csstools-color-scheme--light) var(--signature-bg);
    --signature-hover-bg: var(--csstools-light-dark-toggle--41, #f0f0f4);
    --button-signature-bg: transparent;
    --button-signature-color: var(--main-color);
    --csstools-light-dark-toggle--42: var(--csstools-color-scheme--light) #5b5b66;
    --button-signature-active-bg: var(--csstools-light-dark-toggle--42, #cfcfd8);
    --button-signature-active-border: none;
    --button-signature-active-color: var(--button-signature-color);
    --button-signature-border: none;
    --csstools-light-dark-toggle--43: var(--csstools-color-scheme--light) #52525e;
    --button-signature-hover-bg: var(--csstools-light-dark-toggle--43, #e0e0e6);
    --button-signature-hover-color: var(--button-signature-color);
}

@supports (color: light-dark(red, red)) {
    :root {
        --signature-bg: light-dark(#f9f9fb, #2b2a33);
        --signature-hover-bg: light-dark(#f0f0f4, var(--signature-bg));
        --button-signature-active-bg: light-dark(#cfcfd8, #5b5b66);
        --button-signature-hover-bg: light-dark(#e0e0e6, #52525e);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :root * {
        --csstools-light-dark-toggle--40: var(--csstools-color-scheme--light) #2b2a33;
        --signature-bg: var(--csstools-light-dark-toggle--40, #f9f9fb);
        --csstools-light-dark-toggle--41: var(--csstools-color-scheme--light) var(--signature-bg);
        --signature-hover-bg: var(--csstools-light-dark-toggle--41, #f0f0f4);
        --csstools-light-dark-toggle--42: var(--csstools-color-scheme--light) #5b5b66;
        --button-signature-active-bg: var(--csstools-light-dark-toggle--42, #cfcfd8);
        --csstools-light-dark-toggle--43: var(--csstools-color-scheme--light) #52525e;
        --button-signature-hover-bg: var(--csstools-light-dark-toggle--43, #e0e0e6);
    }
}

@media screen and (forced-colors: active) {

    :root {
        --signature-bg: HighlightText;
        --signature-hover-bg: var(--signature-bg);
        --button-signature-bg: HighlightText;
        --button-signature-color: ButtonText;
        --button-signature-active-bg: ButtonText;
        --button-signature-active-color: HighlightText;
        --button-signature-border: 1px solid ButtonText;
        --button-signature-hover-bg: Highlight;
        --button-signature-hover-color: HighlightText;
    }
}

.signatureDialog {
    --primary-color: var(--text-primary-color);
    --border-color: #8f8f9d;
    --open-link-fg: var(--link-fg-color);
    --open-link-hover-fg: var(--link-hover-fg-color);
}

@media screen and (forced-colors: active) {

    .signatureDialog {
        --primary-color: ButtonText;
        --border-color: ButtonText;
        --open-link-fg: ButtonText;
        --open-link-hover-fg: ButtonText;
    }
}

.signatureDialog {
    width: 570px;
    max-width: 100%;
    min-width: 300px;
    padding: 16px 0;
}

    .signatureDialog .mainContainer {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

:is(.signatureDialog .mainContainer) span:not([role="sectionhead"]) {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

:is(.signatureDialog .mainContainer) .title {
    margin-inline-start: 16px;
}

.signatureDialog .inputWithClearButton {
    --button-dimension: 24px;
    --clear-button-icon: url(images/messageBar_closingButton.svg);
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

:is(.signatureDialog .inputWithClearButton) > input {
    width: 100%;
    height: 32px;
    padding-inline: 8px calc(4px + var(--button-dimension));
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid var(--border-color);
}

:is(.signatureDialog .inputWithClearButton) .clearInputButton {
    position: absolute;
    inset-block-start: 4px;
    inset-inline-end: 4px;
    display: inline-block;
    width: var(--button-dimension);
    height: var(--button-dimension);
    background-color: var(--input-text-fg-color);
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-image: var(--clear-button-icon);
    mask-image: var(--clear-button-icon);
    padding: 0;
    border: 0;
}

#addSignatureDialog {
    --secondary-color: var(--text-secondary-color);
    --bg-hover: #e0e0e6;
    --tab-top-line-active-color: #0060df;
    --tab-top-line-active-hover-color: var(--tab-text-hover-color);
    --tab-top-line-hover-color: #8f8f9d;
    --tab-top-line-inactive-color: #cfcfd8;
    --tab-bottom-line-active-color: var(--tab-top-line-inactive-color);
    --tab-bottom-line-hover-color: var(--tab-top-line-inactive-color);
    --tab-bottom-line-inactive-color: var(--tab-top-line-inactive-color);
    --tab-bg: var(--dialog-bg-color);
    --tab-bg-active-color: var(--tab-bg);
    --tab-bg-active-hover-color: var(--bg-hover);
    --tab-bg-hover: var(--bg-hover);
    --tab-panel-border: none;
    --tab-panel-border-radius: 4px;
    --tab-text-color: var(--primary-color);
    --tab-text-active-color: var(--tab-top-line-active-color);
    --tab-text-active-hover-color: var(--tab-text-hover-color);
    --tab-text-hover-color: var(--tab-text-color);
    --signature-placeholder-color: var(--secondary-color);
    --signature-draw-placeholder-color: var(--primary-color);
    --signature-color: var(--primary-color);
    --clear-signature-button-border-width: 0;
    --clear-signature-button-border-style: solid;
    --clear-signature-button-border-color: transparent;
    --clear-signature-button-border-disabled-color: transparent;
    --clear-signature-button-color: var(--primary-color);
    --clear-signature-button-hover-color: var(--clear-signature-button-color);
    --clear-signature-button-active-color: var(--clear-signature-button-color);
    --clear-signature-button-disabled-color: var(--clear-signature-button-color);
    --clear-signature-button-focus-color: var(--clear-signature-button-color);
    --clear-signature-button-bg: var(--dialog-bg-color);
    --clear-signature-button-bg-hover: var(--bg-hover);
    --clear-signature-button-bg-active: #cfcfd8;
    --clear-signature-button-bg-focus: #f0f0f4;
    --clear-signature-button-bg-disabled: color-mix( in srgb, #f0f0f4, transparent 40% );
    --save-warning-color: var(--secondary-color);
    --thickness-bg: var(--dialog-bg-color);
    --thickness-label-color: var(--primary-color);
    --thickness-slider-color: var(--primary-color);
    --thickness-border: none;
    --draw-cursor: url(images/cursor-editorInk.svg) 0 16, pointer;
}

@media (prefers-color-scheme: dark) {

    #addSignatureDialog {
        --dialog-bg-color: #42414d;
        --bg-hover: #52525e;
        --primary-color: #fbfbfe;
        --secondary-color: #cfcfd8;
        --tab-top-line-active-color: #0df;
        --tab-top-line-inactive-color: #8f8f9d;
        --clear-signature-button-bg-active: #5b5b66;
        --clear-signature-button-bg-focus: #2b2a33;
        --clear-signature-button-bg-disabled: color-mix( in srgb, #2b2a33, transparent 40% );
    }
}

@media screen and (forced-colors: active) {

    #addSignatureDialog {
        --secondary-color: ButtonText;
        --bg: HighlightText;
        --bg-hover: var(--bg);
        --tab-top-line-active-color: ButtonText;
        --tab-top-line-active-hover-color: HighlightText;
        --tab-top-line-hover-color: SelectedItem;
        --tab-top-line-inactive-color: ButtonText;
        --tab-bottom-line-active-color: var(--tab-top-line-active-color);
        --tab-bottom-line-hover-color: var(--tab-top-line-hover-color);
        --tab-bg: var(--bg);
        --tab-bg-active-color: SelectedItem;
        --tab-bg-active-hover-color: SelectedItem;
        --tab-panel-border: 1px solid ButtonText;
        --tab-panel-border-radius: 8px;
        --tab-text-color: ButtonText;
        --tab-text-active-color: HighlightText;
        --tab-text-active-hover-color: HighlightText;
        --tab-text-hover-color: SelectedItem;
        --signature-color: ButtonText;
        --clear-signature-button-border-width: 1px;
        --clear-signature-button-border-style: solid;
        --clear-signature-button-border-color: ButtonText;
        --clear-signature-button-border-disabled-color: GrayText;
        --clear-signature-button-color: ButtonText;
        --clear-signature-button-hover-color: HighlightText;
        --clear-signature-button-active-color: SelectedItem;
        --clear-signature-button-focus-color: CanvasText;
        --clear-signature-button-disabled-color: GrayText;
        --clear-signature-button-bg: var(--bg);
        --clear-signature-button-bg-hover: SelectedItem;
        --clear-signature-button-bg-active: var(--bg);
        --clear-signature-button-bg-focus: var(--bg);
        --clear-signature-button-bg-disabled: var(--bg);
        --thickness-bg: Canvas;
        --thickness-label-color: CanvasText;
        --thickness-slider-color: ButtonText;
        --thickness-border: 1px solid var(--border-color);
    }
}

#addSignatureDialog #addSignatureDialogLabel {
    overflow: hidden;
    position: absolute;
    inset: 0;
    width: 0;
    height: 0;
}

#addSignatureDialog.waiting::after {
    content: "";
    cursor: wait;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

:is(#addSignatureDialog .mainContainer) [role="tablist"] {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 0;
}

:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"] {
    flex: 1 0 0;
    align-self: stretch;
    background-color: var(--tab-bg);
    padding-inline: 0;
    cursor: default;
    border-inline: 0;
    border-block-width: 1px;
    border-block-style: solid;
    border-block-start-color: var(--tab-top-line-inactive-color);
    border-block-end-color: var(--tab-bottom-line-inactive-color);
    border-radius: 0;
    font: menu;
    font-size: 13px;
    font-style: normal;
    line-height: normal;
    font-weight: 400;
    color: var(--tab-text-color);
}

:is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]):hover {
    border-block-start-width: 2px;
    border-block-start-color: var(--tab-top-line-hover-color);
    border-block-end-color: var(--tab-bottom-line-hover-color);
    background-color: var(--tab-bg-hover);
    color: var(--tab-text-hover-color);
}

:is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]):focus-visible {
    outline: 2px solid var(--tab-top-line-active-color);
    outline-offset: -2px;
}

[aria-selected="true"]:is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]) {
    border-block-start-width: 2px;
    border-block-start-color: var(--tab-top-line-active-color);
    border-block-end-color: var(--tab-bottom-line-active-color);
    background-color: var(--tab-bg-active-color);
    font-weight: 590;
    color: var(--tab-text-active-color);
}

    [aria-selected="true"]:is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]):hover {
        border-block-start-color: var(--tab-top-line-active-hover-color);
        background-color: var(--tab-bg-active-hover-color);
        color: var(--tab-text-active-hover-color);
    }

:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    align-self: stretch;
    gap: 12px;
    padding-inline: 16px;
    box-sizing: border-box;
}

:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"] {
    position: relative;
    width: 100%;
    height: 220px;
    background-color: var(--signature-bg);
    border: var(--tab-panel-border);
    border-radius: var(--tab-panel-border-radius);
}

:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
}

#addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) {
    display: none;
}

    #addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureTypeInput {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        border: 0;
        padding: 0;
        text-align: center;
        color: var(--signature-color);
        background-color: transparent;
        border-radius: var(--tab-panel-border-radius);
        font-family: "Brush script", "Apple Chancery", "Segoe script", "Freestyle Script", "Palace Script MT", "Brush Script MT", TK, cursive, serif;
        font-size: 44px;
        font-style: italic;
        font-weight: 400;
    }

:is(#addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureTypeInput)::-moz-placeholder {
    color: var(--signature-placeholder-color);
    text-align: center;
    font: menu;
    font-style: normal;
    font-weight: 274;
    font-size: 44px;
    line-height: normal;
}

:is(#addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureTypeInput)::placeholder {
    color: var(--signature-placeholder-color);
    text-align: center;
    font: menu;
    font-style: normal;
    font-weight: 274;
    font-size: 44px;
    line-height: normal;
}

#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) {
    display: none;
}

    #addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: grid;
        align-items: center;
        justify-content: center;
        background-color: transparent;
        color: var(--signature-placeholder-color);
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }

    #addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg {
        stroke: var(--signature-color);
        fill: none;
        stroke-opacity: 1;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-miterlimit: 10;
    }

:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg):hover {
    cursor: var(--draw-cursor);
}

#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness {
    position: absolute;
    width: 100%;
    inset-block-end: 0;
    display: grid;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > span {
    color: var(--signature-draw-placeholder-color);
}

:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div {
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 6px 8px 7px;
    margin: 0;
    background-color: var(--thickness-bg);
    border-radius: 4px 4px 0 0;
    border-inline: var(--thickness-border);
    border-top: var(--thickness-border);
    pointer-events: auto;
    position: relative;
    top: 1px;
}

:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > label {
    color: var(--thickness-label-color);
}

:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input {
    width: 100px;
    height: 14px;
    background-color: transparent;
}

:is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-webkit-slider-runnable-track, :is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-moz-range-track, :is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-moz-range-progress {
    background-color: var(--thickness-slider-color);
}

:is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-webkit-slider-thumb, :is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-moz-range-thumb {
    background-color: var(--thickness-bg);
}

:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input {
    border-radius: 4.5px;
    border: 0;
    color: var(--signature-color);
}

#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) {
    display: none;
}

    #addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg {
        stroke: none;
        stroke-width: 0;
        fill: var(--signature-color);
        fill-opacity: 1;
    }

    #addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: transparent;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

:is(#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder) span {
    color: var(--signature-placeholder-color);
}

:is(#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder) a {
    color: var(--open-link-fg);
    text-decoration: underline;
    cursor: pointer;
}

:is(:is(#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder) a):hover {
    color: var(--open-link-hover-fg);
}

#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureFilePicker {
    visibility: hidden;
    position: relative;
    width: 0;
    height: 0;
}

[data-selected="type"]:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > #addSignatureTypeContainer, [data-selected="draw"]:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > #addSignatureDrawContainer, [data-selected="image"]:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > #addSignatureImageContainer {
    display: block;
}

:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    align-self: stretch;
}

:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #addSignatureDescriptionContainer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex: 1 0 0;
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #addSignatureDescriptionContainer):has(input:disabled) > label {
    opacity: 0.4;
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #addSignatureDescriptionContainer) > label {
    width: auto;
}

:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton {
    display: flex;
    height: 32px;
    padding: 4px 8px;
    align-items: center;
    background-color: var(--clear-signature-button-bg);
    border-width: var(--clear-signature-button-border-width);
    border-style: var(--clear-signature-button-border-style);
    border-color: var(--clear-signature-button-border-color);
    border-radius: 4px;
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton) > span {
    display: flex;
    height: 24px;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    color: var(--clear-signature-button-color);
}

:is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton) > span)::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    -webkit-mask-image: var(--clear-signature-button-icon);
    mask-image: var(--clear-signature-button-icon);
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--clear-signature-button-color);
    flex-shrink: 0;
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):hover {
    background-color: var(--clear-signature-button-bg-hover);
}

    :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):hover > span {
        color: var(--clear-signature-button-hover-color);
    }

:is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):hover > span)::after {
    background-color: var(--clear-signature-button-hover-color);
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):active {
    background-color: var(--clear-signature-button-bg-active);
}

    :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):active > span {
        color: var(--clear-signature-button-active-color);
    }

:is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):active > span)::after {
    background-color: var(--clear-signature-button-active-color);
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):focus-visible {
    background-color: var(--clear-signature-button-bg-focus);
}

    :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):focus-visible > span {
        color: var(--clear-signature-button-focus-color);
    }

:is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):focus-visible > span)::after {
    background-color: var(--clear-signature-button-focus-color);
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):disabled {
    background-color: var(--clear-signature-button-bg-disabled);
    border-color: var(--clear-signature-button-border-disabled-color);
}

    :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):disabled > span {
        color: var(--clear-signature-button-disabled-color);
    }

:is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):disabled > span)::after {
    background-color: var( --clear-signature-button-disabled-color );
}

:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer {
    display: grid;
    grid-template-columns: max-content auto;
    gap: 4px;
    width: 100%;
}

:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) > input {
    margin: 0;
}

:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) > input):disabled + label {
    opacity: 0.4;
}

:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) > label {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer):not(.fullStorage) #addSignatureSaveWarning {
    display: none;
}

.fullStorage:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) #addSignatureSaveWarning {
    display: block;
    opacity: 1;
    color: var(--save-warning-color);
    font-size: 11px;
}

#editSignatureDescriptionDialog .mainContainer {
    padding-inline: 16px;
    box-sizing: border-box;
}

:is(#editSignatureDescriptionDialog .mainContainer) .title {
    margin-inline-start: 0;
}

:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView {
    width: auto;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

:is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) #editSignatureDescriptionContainer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex: 1 1 auto;
}

:is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) > svg {
    width: 210px;
    height: 180px;
    padding: 8px;
    background-color: var(--signature-bg);
}

:is(:is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) > svg) > path {
    stroke: var(--button-signature-color);
    stroke-width: 1px;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
    fill: none;
}

.contours:is(:is(:is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) > svg) > path) {
    fill: var(--button-signature-color);
    stroke-width: 0.5px;
}

#editorSignatureParamsToolbar {
    padding: 8px;
}

    #editorSignatureParamsToolbar #addSignatureDoorHanger {
        gap: 8px;
        padding: 2px;
    }

:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer {
    height: 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    gap: 8px;
}

:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button {
    border: var(--button-signature-border);
    border-radius: 4px;
    background-color: var(--button-signature-bg);
    color: var(--button-signature-color);
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):hover {
    background-color: var(--button-signature-hover-bg);
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):active {
    border: var(--button-signature-active-border);
    background-color: var(--button-signature-active-bg);
    color: var(--button-signature-active-color);
}

    :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):active::before {
        background-color: var(--button-signature-active-color);
    }

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):focus-visible {
    outline: var(--focus-ring-outline);
}

    :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):focus-visible::before {
        background-color: var(--button-signature-color);
    }

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .deleteButton)::before {
    -webkit-mask-image: var(--clear-signature-button-icon);
    mask-image: var(--clear-signature-button-icon);
}

:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton {
    width: calc(0.8 * var(--editor-toolbar-min-width));
    height: 100%;
    min-height: var(--menuitem-height);
    aspect-ratio: unset;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    outline: none;
    border-radius: 4px;
    box-sizing: border-box;
    font: message-box;
    position: relative;
    flex: 1 1 auto;
    padding: 0;
    gap: 8px;
    text-align: start;
    white-space: normal;
    cursor: default;
    overflow: hidden;
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > svg {
    display: inline-block;
    height: 100%;
    aspect-ratio: 1;
    background-color: var(--signature-bg);
    flex: none;
    padding: 4px;
    box-sizing: border-box;
    border: none;
    border-radius: 4px;
}

:is(:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > svg) > path {
    stroke: var(--button-signature-color);
    stroke-width: 1px;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
    fill: none;
}

.contours:is(:is(:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > svg) > path) {
    fill: var(--button-signature-color);
    stroke-width: 0.5px;
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):is(:hover,:active) > svg {
    border-radius: 4px 0 0 4px;
    background-color: var(--signature-hover-bg);
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):hover > span {
    color: var(--button-signature-hover-color);
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):active {
    background-color: var(--button-signature-active-bg);
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):is([disabled="disabled"],[disabled]) {
    opacity: 0.5;
    pointer-events: none;
}

:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > span {
    height: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    font: menu;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    overflow: hidden;
}

.editDescription.altText {
    --alt-text-add-image: url(images/editor-toolbar-edit.svg) !important;
}

    .editDescription.altText::before {
        width: 16px !important;
        height: 16px !important;
    }

.commentPopup,
#commentManagerDialog {
    width: 360px;
    max-width: 100%;
    min-width: 200px;
    position: absolute;
    padding: 8px 16px 16px;
    margin-left: 0;
    margin-top: 0;
    box-sizing: border-box;
    border-radius: 8px;
}

#commentManagerDialog {
    --comment-close-button-icon: url(images/comment-closeButton.svg);
}

    #commentManagerDialog .mainContainer {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

:is(#commentManagerDialog .mainContainer) #commentManagerToolbar {
    width: 100%;
    height: 32px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    cursor: move;
}

:is(#commentManagerDialog .mainContainer) #commentManagerTextInput {
    width: 100%;
    min-height: 132px;
    margin-bottom: 12px;
}

.annotationLayer.disabled :is(.annotationCommentButton) {
    display: none;
}

:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
    --csstools-color-scheme--light: initial;
    color-scheme: light dark;
    --csstools-light-dark-toggle--44: var(--csstools-color-scheme--light) #1c1b22;
    --comment-button-bg: var(--csstools-light-dark-toggle--44, white);
    --csstools-light-dark-toggle--45: var(--csstools-color-scheme--light) #fbfbfe;
    --comment-button-fg: var(--csstools-light-dark-toggle--45, #5b5b66);
    --csstools-light-dark-toggle--46: var(--csstools-color-scheme--light) #a6ecf4;
    --comment-button-active-bg: var(--csstools-light-dark-toggle--46, #0041a4);
    --csstools-light-dark-toggle--47: var(--csstools-color-scheme--light) #15141a;
    --comment-button-active-fg: var(--csstools-light-dark-toggle--47, white);
    --csstools-light-dark-toggle--48: var(--csstools-color-scheme--light) #61dce9;
    --comment-button-hover-bg: var(--csstools-light-dark-toggle--48, #0053cb);
    --csstools-light-dark-toggle--49: var(--csstools-color-scheme--light) #15141a;
    --comment-button-hover-fg: var(--csstools-light-dark-toggle--49, white);
    --csstools-light-dark-toggle--50: var(--csstools-color-scheme--light) #00cadb;
    --comment-button-selected-bg: var(--csstools-light-dark-toggle--50, #0062fa);
    --csstools-light-dark-toggle--51: var(--csstools-color-scheme--light) #bfbfc9;
    --comment-button-border-color: var(--csstools-light-dark-toggle--51, #8f8f9d);
    --comment-button-active-border-color: var(--comment-button-active-bg);
    --csstools-light-dark-toggle--52: var(--csstools-color-scheme--light) #3a3944;
    --comment-button-focus-border-color: var(--csstools-light-dark-toggle--52, #cfcfd8);
    --comment-button-hover-border-color: var(--comment-button-hover-bg);
    --comment-button-selected-border-color: var(--comment-button-selected-bg);
    --csstools-light-dark-toggle--53: var(--csstools-color-scheme--light) #15141a;
    --comment-button-selected-fg: var(--csstools-light-dark-toggle--53, white);
    --comment-button-dim: 24px;
    --csstools-light-dark-toggle--54: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.2);
    --csstools-light-dark-toggle--55: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.4);
    --comment-button-box-shadow: 0 0.25px 0.75px 0 var(--csstools-light-dark-toggle--54, rgb(0 0 0 / 0.05)), 0 2px 6px 0 var(--csstools-light-dark-toggle--55, rgb(0 0 0 / 0.1));
    --csstools-light-dark-toggle--56: var(--csstools-color-scheme--light) #00cadb;
    --comment-button-focus-outline-color: var(--csstools-light-dark-toggle--56, #0062fa);
}

@supports (color: light-dark(red, red)) {
    :is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
        --comment-button-bg: light-dark(white, #1c1b22);
        --comment-button-fg: light-dark(#5b5b66, #fbfbfe);
        --comment-button-active-bg: light-dark(#0041a4, #a6ecf4);
        --comment-button-active-fg: light-dark(white, #15141a);
        --comment-button-hover-bg: light-dark(#0053cb, #61dce9);
        --comment-button-hover-fg: light-dark(white, #15141a);
        --comment-button-selected-bg: light-dark(#0062fa, #00cadb);
        --comment-button-border-color: light-dark(#8f8f9d, #bfbfc9);
        --comment-button-focus-border-color: light-dark(#cfcfd8, #3a3944);
        --comment-button-selected-fg: light-dark(white, #15141a);
    }
}

@supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)) {
    :is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
        --comment-button-box-shadow: 0 0.25px 0.75px 0 light-dark(rgb(0 0 0 / 0.05), rgb(0 0 0 / 0.2)), 0 2px 6px 0 light-dark(rgb(0 0 0 / 0.1), rgb(0 0 0 / 0.4));
    }
}

@supports (color: light-dark(red, red)) {
    :is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
        --comment-button-focus-outline-color: light-dark(#0062fa, #00cadb);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton) * {
        --csstools-light-dark-toggle--44: var(--csstools-color-scheme--light) #1c1b22;
        --comment-button-bg: var(--csstools-light-dark-toggle--44, white);
        --csstools-light-dark-toggle--45: var(--csstools-color-scheme--light) #fbfbfe;
        --comment-button-fg: var(--csstools-light-dark-toggle--45, #5b5b66);
        --csstools-light-dark-toggle--46: var(--csstools-color-scheme--light) #a6ecf4;
        --comment-button-active-bg: var(--csstools-light-dark-toggle--46, #0041a4);
        --csstools-light-dark-toggle--47: var(--csstools-color-scheme--light) #15141a;
        --comment-button-active-fg: var(--csstools-light-dark-toggle--47, white);
        --csstools-light-dark-toggle--48: var(--csstools-color-scheme--light) #61dce9;
        --comment-button-hover-bg: var(--csstools-light-dark-toggle--48, #0053cb);
        --csstools-light-dark-toggle--49: var(--csstools-color-scheme--light) #15141a;
        --comment-button-hover-fg: var(--csstools-light-dark-toggle--49, white);
        --csstools-light-dark-toggle--50: var(--csstools-color-scheme--light) #00cadb;
        --comment-button-selected-bg: var(--csstools-light-dark-toggle--50, #0062fa);
        --csstools-light-dark-toggle--51: var(--csstools-color-scheme--light) #bfbfc9;
        --comment-button-border-color: var(--csstools-light-dark-toggle--51, #8f8f9d);
        --csstools-light-dark-toggle--52: var(--csstools-color-scheme--light) #3a3944;
        --comment-button-focus-border-color: var(--csstools-light-dark-toggle--52, #cfcfd8);
        --csstools-light-dark-toggle--53: var(--csstools-color-scheme--light) #15141a;
        --comment-button-selected-fg: var(--csstools-light-dark-toggle--53, white);
        --csstools-light-dark-toggle--54: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.2);
        --csstools-light-dark-toggle--55: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.4);
        --comment-button-box-shadow: 0 0.25px 0.75px 0 var(--csstools-light-dark-toggle--54, rgb(0 0 0 / 0.05)), 0 2px 6px 0 var(--csstools-light-dark-toggle--55, rgb(0 0 0 / 0.1));
        --csstools-light-dark-toggle--56: var(--csstools-color-scheme--light) #00cadb;
        --comment-button-focus-outline-color: var(--csstools-light-dark-toggle--56, #0062fa);
    }
}

@media (prefers-color-scheme: dark) {

    :is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
        --csstools-color-scheme--light:;
    }
}

@media screen and (forced-colors: active) {

    :is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
        --comment-button-bg: ButtonFace;
        --comment-button-fg: ButtonText;
        --comment-button-hover-bg: SelectedItemText;
        --comment-button-hover-fg: SelectedItem;
        --comment-button-active-bg: SelectedItemText;
        --comment-button-active-fg: SelectedItem;
        --comment-button-border-color: ButtonBorder;
        --comment-button-active-border-color: ButtonBorder;
        --comment-button-hover-border-color: SelectedItem;
        --comment-button-box-shadow: none;
        --comment-button-focus-outline-color: CanvasText;
        --comment-button-selected-bg: ButtonBorder;
        --comment-button-selected-fg: ButtonFace;
    }
}

:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton {
    position: absolute;
    width: var(--comment-button-dim);
    height: var(--comment-button-dim);
    background-color: var(--comment-button-bg);
    border-radius: 6px 6px 6px 0;
    border: 1px solid var(--comment-button-border-color);
    box-shadow: var(--comment-button-box-shadow);
    cursor: auto;
    z-index: 1;
    padding: 4px;
    margin: 0;
    box-sizing: border-box;
    pointer-events: auto;
}

[dir="rtl"] :is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton) {
    border-radius: 6px 6px 0;
}

:is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton)::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-image: var(--comment-edit-button-icon);
    mask-image: var(--comment-edit-button-icon);
    background-color: var(--comment-button-fg);
    margin: 0;
    padding: 0;
    transform: scaleX(var(--dir-factor));
}

:is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton):focus-visible {
    outline: 2px solid var(--comment-button-focus-outline-color);
    outline-offset: 1px;
    border-color: var(--comment-button-focus-border-color);
}

:is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton):hover {
    background-color: var(--comment-button-hover-bg) !important;
    border-color: var(--comment-button-hover-border-color);
}

    :is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton):hover::before {
        background-color: var(--comment-button-hover-fg);
    }

:is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton):active {
    background-color: var(--comment-button-active-bg) !important;
    border-color: var(--comment-button-active-border-color);
}

    :is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton):active::before {
        background-color: var(--comment-button-active-fg);
    }

.selected:is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton) {
    background-color: var(--comment-button-selected-bg) !important;
    border-color: var(--comment-button-selected-border-color);
}

    .selected:is(:is(.annotationLayer,.annotationEditorLayer) .annotationCommentButton)::before {
        background-color: var(--comment-button-selected-fg);
    }

#editorCommentsSidebar,
.commentPopup {
    --comment-close-button-icon: url(images/comment-closeButton.svg);
    --comment-popup-edit-button-icon: url(images/comment-popup-editButton.svg);
    --comment-popup-delete-button-icon: url(images/editor-toolbar-delete.svg);
    --csstools-light-dark-toggle--57: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.69);
    --comment-date-fg-color: var(--csstools-light-dark-toggle--57, rgb(21 20 26 / 0.69));
    --csstools-light-dark-toggle--58: var(--csstools-color-scheme--light) #1c1b22;
    --comment-bg-color: var(--csstools-light-dark-toggle--58, #f9f9fb);
    --csstools-light-dark-toggle--59: var(--csstools-color-scheme--light) #2c2b33;
    --comment-hover-bg-color: var(--csstools-light-dark-toggle--59, #e0e0e6);
    --csstools-light-dark-toggle--60: var(--csstools-color-scheme--light) #3a3944;
    --comment-active-bg-color: var(--csstools-light-dark-toggle--60, #d1d1d9);
    --comment-hover-brightness: 0.89;
    --comment-hover-filter: brightness(var(--comment-hover-brightness));
    --comment-active-brightness: 0.825;
    --comment-active-filter: brightness(var(--comment-active-brightness));
    --csstools-light-dark-toggle--61: var(--csstools-color-scheme--light) #52525e;
    --comment-border-color: var(--csstools-light-dark-toggle--61, #f0f0f4);
    --csstools-light-dark-toggle--62: var(--csstools-color-scheme--light) #00cadb;
    --comment-focus-outline-color: var(--csstools-light-dark-toggle--62, #0062fa);
    --csstools-light-dark-toggle--63: var(--csstools-color-scheme--light) #fbfbfe;
    --comment-fg-color: var(--csstools-light-dark-toggle--63, #15141a);
    --csstools-light-dark-toggle--64: var(--csstools-color-scheme--light) #00317e;
    --comment-count-bg-color: var(--csstools-light-dark-toggle--64, #e2f7ff);
    --csstools-light-dark-toggle--65: var(--csstools-color-scheme--light) #a6ecf4;
    --comment-indicator-active-fg-color: var(--csstools-light-dark-toggle--65, #0041a4);
    --comment-indicator-active-filter: brightness( calc(1 / var(--comment-active-brightness)) );
    --csstools-light-dark-toggle--66: var(--csstools-color-scheme--light) #fbfbfe;
    --comment-indicator-focus-fg-color: var(--csstools-light-dark-toggle--66, #5b5b66);
    --csstools-light-dark-toggle--67: var(--csstools-color-scheme--light) #61dce9;
    --comment-indicator-hover-fg-color: var(--csstools-light-dark-toggle--67, #0053cb);
    --comment-indicator-hover-filter: brightness( calc(1 / var(--comment-hover-brightness)) );
    --csstools-light-dark-toggle--68: var(--csstools-color-scheme--light) #00cadb;
    --comment-indicator-selected-fg-color: var(--csstools-light-dark-toggle--68, #0062fa);
    --button-comment-bg: transparent;
    --button-comment-color: var(--main-color);
    --csstools-light-dark-toggle--69: var(--csstools-color-scheme--light) #5b5b66;
    --button-comment-active-bg: var(--csstools-light-dark-toggle--69, #cfcfd8);
    --button-comment-active-border: none;
    --button-comment-active-color: var(--button-comment-color);
    --button-comment-border: none;
    --csstools-light-dark-toggle--70: var(--csstools-color-scheme--light) #52525e;
    --button-comment-hover-bg: var(--csstools-light-dark-toggle--70, #e0e0e6);
    --button-comment-hover-color: var(--button-comment-color);
    --csstools-light-dark-toggle--71: var(--csstools-color-scheme--light) #0df;
    --link-fg-color: var(--csstools-light-dark-toggle--71, #0060df);
    --csstools-light-dark-toggle--72: var(--csstools-color-scheme--light) #80ebff;
    --link-hover-fg-color: var(--csstools-light-dark-toggle--72, #0250bb);
}

@supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)) {
    #editorCommentsSidebar,
    .commentPopup {
        --comment-date-fg-color: light-dark( rgb(21 20 26 / 0.69), rgb(251 251 254 / 0.69) );
    }
}

@supports (color: light-dark(red, red)) {
    #editorCommentsSidebar,
    .commentPopup {
        --comment-bg-color: light-dark(#f9f9fb, #1c1b22);
        --comment-hover-bg-color: light-dark(#e0e0e6, #2c2b33);
        --comment-active-bg-color: light-dark(#d1d1d9, #3a3944);
        --comment-border-color: light-dark(#f0f0f4, #52525e);
        --comment-focus-outline-color: light-dark(#0062fa, #00cadb);
        --comment-fg-color: light-dark(#15141a, #fbfbfe);
        --comment-count-bg-color: light-dark(#e2f7ff, #00317e);
        --comment-indicator-active-fg-color: light-dark(#0041a4, #a6ecf4);
        --comment-indicator-focus-fg-color: light-dark(#5b5b66, #fbfbfe);
        --comment-indicator-hover-fg-color: light-dark(#0053cb, #61dce9);
        --comment-indicator-selected-fg-color: light-dark(#0062fa, #00cadb);
        --button-comment-active-bg: light-dark(#cfcfd8, #5b5b66);
        --button-comment-hover-bg: light-dark(#e0e0e6, #52525e);
        --link-fg-color: light-dark(#0060df, #0df);
        --link-hover-fg-color: light-dark(#0250bb, #80ebff);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :is(#editorCommentsSidebar,.commentPopup) * {
        --csstools-light-dark-toggle--57: var(--csstools-color-scheme--light) rgb(251 251 254 / 0.69);
        --comment-date-fg-color: var(--csstools-light-dark-toggle--57, rgb(21 20 26 / 0.69));
        --csstools-light-dark-toggle--58: var(--csstools-color-scheme--light) #1c1b22;
        --comment-bg-color: var(--csstools-light-dark-toggle--58, #f9f9fb);
        --csstools-light-dark-toggle--59: var(--csstools-color-scheme--light) #2c2b33;
        --comment-hover-bg-color: var(--csstools-light-dark-toggle--59, #e0e0e6);
        --csstools-light-dark-toggle--60: var(--csstools-color-scheme--light) #3a3944;
        --comment-active-bg-color: var(--csstools-light-dark-toggle--60, #d1d1d9);
        --csstools-light-dark-toggle--61: var(--csstools-color-scheme--light) #52525e;
        --comment-border-color: var(--csstools-light-dark-toggle--61, #f0f0f4);
        --csstools-light-dark-toggle--62: var(--csstools-color-scheme--light) #00cadb;
        --comment-focus-outline-color: var(--csstools-light-dark-toggle--62, #0062fa);
        --csstools-light-dark-toggle--63: var(--csstools-color-scheme--light) #fbfbfe;
        --comment-fg-color: var(--csstools-light-dark-toggle--63, #15141a);
        --csstools-light-dark-toggle--64: var(--csstools-color-scheme--light) #00317e;
        --comment-count-bg-color: var(--csstools-light-dark-toggle--64, #e2f7ff);
        --csstools-light-dark-toggle--65: var(--csstools-color-scheme--light) #a6ecf4;
        --comment-indicator-active-fg-color: var(--csstools-light-dark-toggle--65, #0041a4);
        --csstools-light-dark-toggle--66: var(--csstools-color-scheme--light) #fbfbfe;
        --comment-indicator-focus-fg-color: var(--csstools-light-dark-toggle--66, #5b5b66);
        --csstools-light-dark-toggle--67: var(--csstools-color-scheme--light) #61dce9;
        --comment-indicator-hover-fg-color: var(--csstools-light-dark-toggle--67, #0053cb);
        --csstools-light-dark-toggle--68: var(--csstools-color-scheme--light) #00cadb;
        --comment-indicator-selected-fg-color: var(--csstools-light-dark-toggle--68, #0062fa);
        --csstools-light-dark-toggle--69: var(--csstools-color-scheme--light) #5b5b66;
        --button-comment-active-bg: var(--csstools-light-dark-toggle--69, #cfcfd8);
        --csstools-light-dark-toggle--70: var(--csstools-color-scheme--light) #52525e;
        --button-comment-hover-bg: var(--csstools-light-dark-toggle--70, #e0e0e6);
        --csstools-light-dark-toggle--71: var(--csstools-color-scheme--light) #0df;
        --link-fg-color: var(--csstools-light-dark-toggle--71, #0060df);
        --csstools-light-dark-toggle--72: var(--csstools-color-scheme--light) #80ebff;
        --link-hover-fg-color: var(--csstools-light-dark-toggle--72, #0250bb);
    }
}

@media screen and (forced-colors: active) {

    #editorCommentsSidebar,
    .commentPopup {
        --comment-date-fg-color: CanvasText;
        --comment-bg-color: Canvas;
        --comment-hover-bg-color: Canvas;
        --comment-hover-filter: none;
        --comment-active-bg-color: Canvas;
        --comment-active-filter: none;
        --comment-border-color: CanvasText;
        --comment-fg-color: CanvasText;
        --comment-count-bg-color: Canvas;
        --comment-indicator-active-fg-color: SelectedItem;
        --comment-indicator-focus-fg-color: CanvasText;
        --comment-indicator-hover-fg-color: CanvasText;
        --comment-indicator-selected-fg-color: SelectedItem;
        --button-comment-bg: ButtonFace;
        --button-comment-color: ButtonText;
        --button-comment-active-bg: Highlight;
        --button-comment-active-color: HighlightText;
        --button-comment-border: 1px solid ButtonText;
        --button-comment-hover-bg: Highlight;
        --button-comment-hover-color: HighlightText;
        --link-fg-color: LinkText;
        --link-hover-fg-color: LinkText;
    }
}

#editorCommentsSidebar {
    display: flex;
    height: auto;
    padding-bottom: 16px;
    flex-direction: column;
    align-items: flex-start;
}

    #editorCommentsSidebar #editorCommentsSidebarHeader {
        width: 100%;
        box-sizing: border-box;
        padding: 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

:is(#editorCommentsSidebar #editorCommentsSidebarHeader) .commentCount {
    display: flex;
    align-items: baseline;
    gap: 6px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) .commentCount) #editorCommentsSidebarTitle {
    font: menu;
    font-style: normal;
    font-weight: 590;
    line-height: normal;
    font-size: 17px;
    color: var(--comment-fg-color);
}

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) .commentCount) #editorCommentsSidebarCount {
    padding: 0 4px;
    border-radius: 4px;
    background-color: var(--comment-count-bg-color);
    color: var(--comment-fg-color);
    text-align: center;
    font: menu;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton {
    width: 32px;
    height: 32px;
    padding: 8px;
    border-radius: 4px;
    border: var(--button-comment-border);
    background-color: var(--button-comment-bg);
    cursor: pointer;
}

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton)::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-image: var(--comment-close-button-icon);
    mask-image: var(--comment-close-button-icon);
    background-color: var(--button-comment-color);
}

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton):hover {
    background-color: var(--button-comment-hover-bg);
}

    :is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton):hover::before {
        background-color: var(--button-comment-hover-color);
    }

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton):active {
    border: var(--button-comment-active-border);
    background-color: var(--button-comment-active-bg);
}

    :is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton):active::before {
        background-color: var(--button-comment-active-color);
    }

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton):focus-visible {
    outline: var(--focus-ring-outline);
}

:is(:is(#editorCommentsSidebar #editorCommentsSidebarHeader) #editorCommentsSidebarCloseButton) > span {
    display: inline-block;
    width: 0;
    height: 0;
    overflow: hidden;
}

#editorCommentsSidebar #editorCommentsSidebarListContainer {
    overflow: auto;
    width: 100%;
}

:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList {
    display: flex;
    width: auto;
    padding: 4px 16px;
    gap: 10px;
    align-items: flex-start;
    flex-direction: column;
    list-style-type: none;
}

:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment {
    display: flex;
    width: auto;
    padding: 8px 16px 16px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    gap: 4px;
    border-radius: 8px;
    border: 0.5px solid var(--comment-border-color);
    background-color: var(--comment-bg-color);
}

@media screen and (forced-colors: active) {

    :is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):hover {
        background-color: var(--comment-hover-bg-color);
    }
}

:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):hover {
    filter: var(--comment-hover-filter);
}

    :is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):hover time::after {
        display: inline-block;
        background-color: var(--comment-indicator-hover-fg-color);
        filter: var(--comment-indicator-hover-filter);
    }

@media screen and (forced-colors: active) {

    :is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):active {
        background-color: var(--comment-active-bg-color);
    }
}

:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):active {
    filter: var(--comment-active-filter);
}

    :is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):active time::after {
        display: inline-block;
        background-color: var(--comment-indicator-active-fg-color);
        filter: var(--comment-indicator-active-filter);
    }

:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):is(:focus,:focus-visible) time::after {
    display: inline-block;
    background-color: var(--comment-indicator-focus-fg-color);
}

:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments):focus-visible {
    outline: 2px solid var(--comment-focus-outline-color);
    outline-offset: 2px;
}

.selected:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments) .sidebarCommentText {
    max-height: -moz-fit-content;
    max-height: fit-content;
    -webkit-line-clamp: unset;
}

.selected:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment):not(.noComments) time::after {
    display: inline-block;
    background-color: var(--comment-indicator-selected-fg-color);
}

:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) .sidebarCommentText {
    font: menu;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 15px;
    width: 100%;
    height: -moz-fit-content;
    height: fit-content;
    max-height: 80px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: break-word;
}

:is(:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) .sidebarCommentText) .richText {
    --total-scale-factor: 1.5;
}

.noComments:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) .sidebarCommentText {
    max-height: -moz-fit-content;
    max-height: fit-content;
    -webkit-line-clamp: unset;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.noComments:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) a {
    font: menu;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 15px;
    width: 100%;
    height: auto;
    overflow-wrap: break-word;
    margin-block-start: 15px;
    color: var(--link-fg-color);
}

:is(.noComments:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) a):focus-visible {
    outline: var(--focus-ring-outline);
}

:is(.noComments:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) a):hover {
    color: var(--link-hover-fg-color);
}

:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) time {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    font: menu;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 13px;
}

:is(:is(:is(:is(#editorCommentsSidebar #editorCommentsSidebarListContainer) #editorCommentsSidebarList) .sidebarComment) time)::after {
    content: "";
    display: none;
    width: 16px;
    height: 16px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-image: var(--comment-edit-button-icon);
    mask-image: var(--comment-edit-button-icon);
    transform: scaleX(var(--dir-factor));
}

.commentPopup {
    --csstools-color-scheme--light: initial;
    color-scheme: light dark;
    --csstools-light-dark-toggle--73: var(--csstools-color-scheme--light) #3a3944;
    --divider-color: var(--csstools-light-dark-toggle--73, #cfcfd8);
    --csstools-light-dark-toggle--74: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.2);
    --csstools-light-dark-toggle--75: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.4);
    --comment-shadow: 0 0.5px 2px 0 var(--csstools-light-dark-toggle--74, rgb(0 0 0 / 0.05)), 0 4px 16px 0 var(--csstools-light-dark-toggle--75, rgb(0 0 0 / 0.1));
}

@supports (color: light-dark(red, red)) {
    .commentPopup {
        --divider-color: light-dark(#cfcfd8, #3a3944);
    }
}

@supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)) {
    .commentPopup {
        --comment-shadow: 0 0.5px 2px 0 light-dark(rgb(0 0 0 / 0.05), rgb(0 0 0 / 0.2)), 0 4px 16px 0 light-dark(rgb(0 0 0 / 0.1), rgb(0 0 0 / 0.4));
    }
}

@supports not (color: light-dark(tan, tan)) {

    .commentPopup * {
        --csstools-light-dark-toggle--73: var(--csstools-color-scheme--light) #3a3944;
        --divider-color: var(--csstools-light-dark-toggle--73, #cfcfd8);
        --csstools-light-dark-toggle--74: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.2);
        --csstools-light-dark-toggle--75: var(--csstools-color-scheme--light) rgb(0 0 0 / 0.4);
        --comment-shadow: 0 0.5px 2px 0 var(--csstools-light-dark-toggle--74, rgb(0 0 0 / 0.05)), 0 4px 16px 0 var(--csstools-light-dark-toggle--75, rgb(0 0 0 / 0.1));
    }
}

@media (prefers-color-scheme: dark) {

    .commentPopup {
        --csstools-color-scheme--light:;
    }
}

@media screen and (forced-colors: active) {

    .commentPopup {
        --divider-color: CanvasText;
        --comment-shadow: none;
    }
}

.commentPopup {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    z-index: 100001;
    pointer-events: auto;
    margin-top: 2px;
    border: 0.5px solid var(--comment-border-color);
    background: var(--comment-bg-color);
    box-shadow: var(--comment-shadow);
}

    .commentPopup:focus-visible {
        outline: none;
    }

    .commentPopup.dragging {
        cursor: move !important;
    }

        .commentPopup.dragging * {
            cursor: move !important;
        }

        .commentPopup.dragging button {
            pointer-events: none !important;
        }

    .commentPopup:not(.selected) .commentPopupButtons {
        visibility: hidden !important;
    }

    .commentPopup hr {
        width: 100%;
        height: 1px;
        border: none;
        border-top: 1px solid var(--divider-color);
        margin: 0;
        padding: 0;
    }

    .commentPopup .commentPopupTop {
        display: flex;
        width: 100%;
        height: auto;
        padding-bottom: 4px;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;
        cursor: move;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }

:is(.commentPopup .commentPopupTop) .commentPopupTime {
    font: menu;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 13px;
    color: var(--comment-date-fg-color);
}

:is(.commentPopup .commentPopupTop) .commentPopupButtons {
    display: flex;
    align-items: center;
    gap: 2px;
    cursor: default;
}

:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button {
    width: 32px;
    height: 32px;
    padding: 8px;
    border: var(--button-comment-border);
    border-radius: 4px;
    background-color: var(--button-comment-bg);
    color: var(--button-comment-color);
}

:is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button):hover {
    background-color: var(--button-comment-hover-bg);
}

    :is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button):hover::before {
        background-color: var(--button-comment-hover-color);
    }

:is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button):active {
    border: var(--button-comment-active-border);
    background-color: var(--button-comment-active-bg);
    color: var(--button-comment-active-color);
}

    :is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button):active::before {
        background-color: var(--button-comment-active-color);
    }

:is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button):focus-visible {
    background-color: var(--button-comment-hover-bg);
    outline: 2px solid var(--comment-focus-outline-color);
    outline-offset: 0;
}

:is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button)::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.commentPopupEdit:is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button)::before {
    -webkit-mask-image: var(--comment-popup-edit-button-icon);
    mask-image: var(--comment-popup-edit-button-icon);
}

.commentPopupDelete:is(:is(:is(.commentPopup .commentPopupTop) .commentPopupButtons) > button)::before {
    -webkit-mask-image: var(--comment-popup-delete-button-icon);
    mask-image: var(--comment-popup-delete-button-icon);
}

.commentPopup .commentPopupText {
    width: 100%;
    height: auto;
    font: menu;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 15px;
    color: var(--comment-fg-color);
}

.commentPopupText,
.sidebarCommentText .richText {
    margin-block: 0;
}

:is(.commentPopupText,.sidebarCommentText .richText) p:first-of-type {
    margin-block: 0;
}

:is(.commentPopupText,.sidebarCommentText .richText) > * {
    white-space: pre-wrap;
    font-size: max(15px, calc(10px * var(--total-scale-factor)));
    overflow-wrap: break-word;
}

:is(.commentPopupText,.sidebarCommentText .richText) span {
    color: var(--comment-fg-color) !important;
}

:root {
    --editor-toolbar-vert-offset: 6px;
    --outline-width: 2px;
    --outline-color: #0060df;
    --outline-around-width: 1px;
    --outline-around-color: #f0f0f4;
    --hover-outline-around-color: var(--outline-around-color);
    --focus-outline: solid var(--outline-width) var(--outline-color);
    --unfocus-outline: solid var(--outline-width) transparent;
    --focus-outline-around: solid var(--outline-around-width) var(--outline-around-color);
    --hover-outline-color: #8f8f9d;
    --hover-outline: solid var(--outline-width) var(--hover-outline-color);
    --hover-outline-around: solid var(--outline-around-width) var(--hover-outline-around-color);
    --freetext-line-height: 1.35;
    --freetext-padding: 2px;
    --resizer-bg-color: var(--outline-color);
    --resizer-size: 6px;
    --resizer-shift: calc( 0px - (var(--outline-width) + var(--resizer-size)) / 2 - var(--outline-around-width) );
    --editorFreeText-editing-cursor: text;
    --editorInk-editing-cursor: url(images/cursor-editorInk.svg) 0 16, pointer;
    --editorHighlight-editing-cursor: url(images/cursor-editorTextHighlight.svg) 24 24, text;
    --editorFreeHighlight-editing-cursor: url(images/cursor-editorFreeHighlight.svg) 1 18, pointer;
    --new-alt-text-warning-image: url(images/altText_warning.svg);
}

.textLayer.highlighting {
    cursor: var(--editorFreeHighlight-editing-cursor);
}

    .textLayer.highlighting:not(.free) span {
        cursor: var(--editorHighlight-editing-cursor);
    }

[role="img"]:is(.textLayer.highlighting:not(.free) span) {
    cursor: var(--editorFreeHighlight-editing-cursor);
}

.textLayer.highlighting.free span {
    cursor: var(--editorFreeHighlight-editing-cursor);
}

.page:has(.annotationEditorLayer.nonEditing)
.annotationLayer
.editorAnnotation {
    position: absolute;
    pointer-events: none;
}

:is(#viewerContainer.pdfPresentationMode:fullscreen,.annotationEditorLayer.disabled) .noAltTextBadge {
    display: none !important;
}

@media (min-resolution: 1.1dppx) {
    :root {
        --editorFreeText-editing-cursor: url(images/cursor-editorFreeText.svg) 0 16, text;
    }
}

@media screen and (forced-colors: active) {
    :root {
        --outline-color: CanvasText;
        --outline-around-color: ButtonFace;
        --resizer-bg-color: ButtonText;
        --hover-outline-color: Highlight;
        --hover-outline-around-color: SelectedItemText;
    }
}

[data-editor-rotation="90"] {
    transform: rotate(90deg);
}

[data-editor-rotation="180"] {
    transform: rotate(180deg);
}

[data-editor-rotation="270"] {
    transform: rotate(270deg);
}

.annotationEditorLayer {
    background: transparent;
    position: absolute;
    inset: 0;
    font-size: calc(100px * var(--total-scale-factor));
    transform-origin: 0 0;
    cursor: auto;
}

    .annotationEditorLayer .selectedEditor {
        z-index: 100000 !important;
    }

    .annotationEditorLayer.drawing * {
        pointer-events: none !important;
    }

    .annotationEditorLayer.getElements {
        pointer-events: auto !important;
    }

        .annotationEditorLayer.getElements > div {
            pointer-events: auto !important;
        }

    .annotationEditorLayer.waiting {
        content: "";
        cursor: wait;
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .annotationEditorLayer.disabled {
        pointer-events: none;
    }

        .annotationEditorLayer.disabled.highlightEditing :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor,.commentPopup) {
            pointer-events: auto;
        }

    .annotationEditorLayer.freetextEditing {
        cursor: var(--editorFreeText-editing-cursor);
    }

    .annotationEditorLayer.inkEditing {
        cursor: var(--editorInk-editing-cursor);
    }

    .annotationEditorLayer .draw {
        box-sizing: border-box;
    }

    .annotationEditorLayer
    :is(.freeTextEditor, .inkEditor, .stampEditor, .signatureEditor) {
        position: absolute;
        background: transparent;
        z-index: 1;
        transform-origin: 0 0;
        cursor: auto;
        max-width: 100%;
        max-height: 100%;
        border: var(--unfocus-outline);
    }

.draggable.selectedEditor:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) {
    cursor: move;
}

.selectedEditor:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) {
    border: var(--focus-outline);
    outline: var(--focus-outline-around);
}

    .selectedEditor:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor))::before {
        content: "";
        position: absolute;
        inset: 0;
        border: var(--focus-outline-around);
        pointer-events: none;
    }

:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)):hover:not(.selectedEditor) {
    border: var(--hover-outline);
    outline: var(--hover-outline-around);
}

    :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)):hover:not(.selectedEditor)::before {
        content: "";
        position: absolute;
        inset: 0;
        border: var(--focus-outline-around);
    }

:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar {
    --editor-toolbar-delete-image: url(images/editor-toolbar-delete.svg);
    --csstools-light-dark-toggle--76: var(--csstools-color-scheme--light) #2b2a33;
    --editor-toolbar-bg-color: var(--csstools-light-dark-toggle--76, #f0f0f4);
    --editor-toolbar-highlight-image: url(images/toolbarButton-editorHighlight.svg);
    --csstools-light-dark-toggle--77: var(--csstools-color-scheme--light) #fbfbfe;
    --editor-toolbar-fg-color: var(--csstools-light-dark-toggle--77, #2e2e56);
    --editor-toolbar-border-color: #8f8f9d;
    --editor-toolbar-hover-border-color: var(--editor-toolbar-border-color);
    --csstools-light-dark-toggle--78: var(--csstools-color-scheme--light) #52525e;
    --editor-toolbar-hover-bg-color: var(--csstools-light-dark-toggle--78, #e0e0e6);
    --editor-toolbar-hover-fg-color: var(--editor-toolbar-fg-color);
    --editor-toolbar-hover-outline: none;
    --csstools-light-dark-toggle--79: var(--csstools-color-scheme--light) #0df;
    --editor-toolbar-focus-outline-color: var(--csstools-light-dark-toggle--79, #0060df);
    --editor-toolbar-shadow: 0 2px 6px 0 rgb(58 57 68 / 0.2);
    --editor-toolbar-height: 28px;
    --editor-toolbar-padding: 2px;
    --csstools-light-dark-toggle--80: var(--csstools-color-scheme--light) #54ffbd;
    --alt-text-done-color: var(--csstools-light-dark-toggle--80, #2ac3a2);
    --csstools-light-dark-toggle--81: var(--csstools-color-scheme--light) #80ebff;
    --alt-text-warning-color: var(--csstools-light-dark-toggle--81, #0090ed);
    --alt-text-hover-done-color: var(--alt-text-done-color);
    --alt-text-hover-warning-color: var(--alt-text-warning-color);
}

@supports (color: light-dark(red, red)) {
    :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar {
        --editor-toolbar-bg-color: light-dark(#f0f0f4, #2b2a33);
        --editor-toolbar-fg-color: light-dark(#2e2e56, #fbfbfe);
        --editor-toolbar-hover-bg-color: light-dark(#e0e0e6, #52525e);
        --editor-toolbar-focus-outline-color: light-dark(#0060df, #0df);
        --alt-text-done-color: light-dark(#2ac3a2, #54ffbd);
        --alt-text-warning-color: light-dark(#0090ed, #80ebff);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) * {
        --csstools-light-dark-toggle--76: var(--csstools-color-scheme--light) #2b2a33;
        --editor-toolbar-bg-color: var(--csstools-light-dark-toggle--76, #f0f0f4);
        --csstools-light-dark-toggle--77: var(--csstools-color-scheme--light) #fbfbfe;
        --editor-toolbar-fg-color: var(--csstools-light-dark-toggle--77, #2e2e56);
        --csstools-light-dark-toggle--78: var(--csstools-color-scheme--light) #52525e;
        --editor-toolbar-hover-bg-color: var(--csstools-light-dark-toggle--78, #e0e0e6);
        --csstools-light-dark-toggle--79: var(--csstools-color-scheme--light) #0df;
        --editor-toolbar-focus-outline-color: var(--csstools-light-dark-toggle--79, #0060df);
        --csstools-light-dark-toggle--80: var(--csstools-color-scheme--light) #54ffbd;
        --alt-text-done-color: var(--csstools-light-dark-toggle--80, #2ac3a2);
        --csstools-light-dark-toggle--81: var(--csstools-color-scheme--light) #80ebff;
        --alt-text-warning-color: var(--csstools-light-dark-toggle--81, #0090ed);
    }
}

@media screen and (forced-colors: active) {

    :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar {
        --editor-toolbar-bg-color: ButtonFace;
        --editor-toolbar-fg-color: ButtonText;
        --editor-toolbar-border-color: ButtonText;
        --editor-toolbar-hover-border-color: AccentColor;
        --editor-toolbar-hover-bg-color: ButtonFace;
        --editor-toolbar-hover-fg-color: AccentColor;
        --editor-toolbar-hover-outline: 2px solid var(--editor-toolbar-hover-border-color);
        --editor-toolbar-focus-outline-color: ButtonBorder;
        --editor-toolbar-shadow: none;
        --alt-text-done-color: var(--editor-toolbar-fg-color);
        --alt-text-warning-color: var(--editor-toolbar-fg-color);
        --alt-text-hover-done-color: var(--editor-toolbar-hover-fg-color);
        --alt-text-hover-warning-color: var(--editor-toolbar-hover-fg-color);
    }
}

:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar {
    display: flex;
    width: -moz-fit-content;
    width: fit-content;
    height: var(--editor-toolbar-height);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: default;
    pointer-events: auto;
    box-sizing: content-box;
    padding: var(--editor-toolbar-padding);
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: calc(100% + var(--editor-toolbar-vert-offset));
    border-radius: 6px;
    background-color: var(--editor-toolbar-bg-color);
    border: 1px solid var(--editor-toolbar-border-color);
    box-shadow: var(--editor-toolbar-shadow);
}

.hidden:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) {
    display: none;
}

:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar):has(:focus-visible) {
    border-color: transparent;
}

[dir="ltr"] :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) {
    transform-origin: 100% 0;
}

[dir="rtl"] :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) {
    transform-origin: 0 0;
}

:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0;
    height: 100%;
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) button {
    padding: 0;
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .divider {
    width: 0;
    height: calc( 2 * var(--editor-toolbar-padding) + var(--editor-toolbar-height) );
    border-left: 1px solid var(--editor-toolbar-border-color);
    border-right: none;
    display: inline-block;
    margin-inline: 2px;
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .basic {
    width: var(--editor-toolbar-height);
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .basic)::before {
    content: "";
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    display: inline-block;
    background-color: var(--editor-toolbar-fg-color);
    width: 100%;
    height: 100%;
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .basic):hover::before {
    background-color: var(--editor-toolbar-hover-fg-color);
}

.highlightButton:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .basic)::before {
    -webkit-mask-image: var(--editor-toolbar-highlight-image);
    mask-image: var(--editor-toolbar-highlight-image);
}

.commentButton:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .basic)::before {
    -webkit-mask-image: var(--comment-edit-button-icon);
    mask-image: var(--comment-edit-button-icon);
}

.deleteButton:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .basic)::before {
    -webkit-mask-image: var(--editor-toolbar-delete-image);
    mask-image: var(--editor-toolbar-delete-image);
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > * {
    height: var(--editor-toolbar-height);
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider) {
    border: none;
    background-color: transparent;
    cursor: pointer;
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider)):hover {
    border-radius: 2px;
    background-color: var(--editor-toolbar-hover-bg-color);
    color: var(--editor-toolbar-hover-fg-color);
    outline: var(--editor-toolbar-hover-outline);
    outline-offset: 1px;
}

    :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider)):hover:active {
        outline: none;
    }

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider)):focus-visible {
    border-radius: 2px;
    outline: 2px solid var(--editor-toolbar-focus-outline-color);
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText {
    --alt-text-add-image: url(images/altText_add.svg);
    --alt-text-done-image: url(images/altText_done.svg);
    display: flex;
    align-items: center;
    justify-content: center;
    width: -moz-max-content;
    width: max-content;
    padding-inline: 8px;
    pointer-events: all;
    font: menu;
    font-weight: 590;
    font-size: 12px;
    color: var(--editor-toolbar-fg-color);
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):disabled {
    pointer-events: none;
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before {
    content: "";
    -webkit-mask-image: var(--alt-text-add-image);
    mask-image: var(--alt-text-add-image);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    display: inline-block;
    width: 12px;
    height: 13px;
    background-color: var(--editor-toolbar-fg-color);
    margin-inline-end: 4px;
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):hover::before {
    background-color: var(--editor-toolbar-hover-fg-color);
}

.done:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before {
    -webkit-mask-image: var(--alt-text-done-image);
    mask-image: var(--alt-text-done-image);
}

.new:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before {
    width: 16px;
    height: 16px;
    -webkit-mask-image: var(--new-alt-text-warning-image);
    mask-image: var(--new-alt-text-warning-image);
    background-color: var(--alt-text-warning-color);
    -webkit-mask-size: cover;
    mask-size: cover;
}

.new:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):hover::before {
    background-color: var(--alt-text-hover-warning-color);
}

.new.done:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before {
    -webkit-mask-image: var(--alt-text-done-image);
    mask-image: var(--alt-text-done-image);
    background-color: var(--alt-text-done-color);
}

.new.done:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):hover::before {
    background-color: var(--alt-text-hover-done-color);
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip {
    display: none;
    word-wrap: anywhere;
}

.show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) {
    --csstools-light-dark-toggle--82: var(--csstools-color-scheme--light) #1c1b22;
    --alt-text-tooltip-bg: var(--csstools-light-dark-toggle--82, #f0f0f4);
    --csstools-light-dark-toggle--83: var(--csstools-color-scheme--light) #fbfbfe;
    --alt-text-tooltip-fg: var(--csstools-light-dark-toggle--83, #15141a);
    --alt-text-tooltip-border: #8f8f9d;
    --csstools-light-dark-toggle--84: var(--csstools-color-scheme--light) #15141a;
    --alt-text-tooltip-shadow: 0 2px 6px 0 var(--csstools-light-dark-toggle--84, rgb(58 57 68 / 0.2));
}

@supports (color: light-dark(red, red)) {
    .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) {
        --alt-text-tooltip-bg: light-dark(#f0f0f4, #1c1b22);
        --alt-text-tooltip-fg: light-dark(#15141a, #fbfbfe);
    }
}

@supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)) {
    .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) {
        --alt-text-tooltip-shadow: 0 2px 6px 0 light-dark(rgb(58 57 68 / 0.2), #15141a);
    }
}

@supports not (color: light-dark(tan, tan)) {

    .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) * {
        --csstools-light-dark-toggle--82: var(--csstools-color-scheme--light) #1c1b22;
        --alt-text-tooltip-bg: var(--csstools-light-dark-toggle--82, #f0f0f4);
        --csstools-light-dark-toggle--83: var(--csstools-color-scheme--light) #fbfbfe;
        --alt-text-tooltip-fg: var(--csstools-light-dark-toggle--83, #15141a);
        --csstools-light-dark-toggle--84: var(--csstools-color-scheme--light) #15141a;
        --alt-text-tooltip-shadow: 0 2px 6px 0 var(--csstools-light-dark-toggle--84, rgb(58 57 68 / 0.2));
    }
}

@media screen and (forced-colors: active) {

    .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) {
        --alt-text-tooltip-bg: Canvas;
        --alt-text-tooltip-fg: CanvasText;
        --alt-text-tooltip-border: CanvasText;
        --alt-text-tooltip-shadow: none;
    }
}

.show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: calc(100% + 2px);
    inset-inline-start: 0;
    padding-block: 2px 3px;
    padding-inline: 3px;
    max-width: 300px;
    width: -moz-max-content;
    width: max-content;
    height: auto;
    font-size: 12px;
    border: 0.5px solid var(--alt-text-tooltip-border);
    background: var(--alt-text-tooltip-bg);
    box-shadow: var(--alt-text-tooltip-shadow);
    color: var(--alt-text-tooltip-fg);
    pointer-events: none;
}

:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .comment {
    width: var(--editor-toolbar-height);
}

:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .comment)::before {
    content: "";
    -webkit-mask-image: var(--comment-edit-button-icon);
    mask-image: var(--comment-edit-button-icon);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    display: inline-block;
    background-color: var(--editor-toolbar-fg-color);
    width: 100%;
    height: 100%;
}

.annotationEditorLayer .freeTextEditor {
    padding: calc(var(--freetext-padding) * var(--total-scale-factor));
    width: auto;
    height: auto;
    touch-action: none;
}

    .annotationEditorLayer .freeTextEditor .internal {
        background: transparent;
        border: none;
        inset: 0;
        overflow: visible;
        white-space: nowrap;
        font: 10px sans-serif;
        line-height: var(--freetext-line-height);
        text-align: start;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }

    .annotationEditorLayer .freeTextEditor .overlay {
        position: absolute;
        display: none;
        background: transparent;
        inset: 0;
        width: 100%;
        height: 100%;
    }

.annotationEditorLayer freeTextEditor .overlay.enabled {
    display: block;
}

.annotationEditorLayer .freeTextEditor .internal:empty::before {
    content: attr(default-content);
    color: gray;
}

.annotationEditorLayer .freeTextEditor .internal:focus {
    outline: none;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    user-select: auto;
}

.annotationEditorLayer .inkEditor {
    width: 100%;
    height: 100%;
}

    .annotationEditorLayer .inkEditor.editing {
        cursor: inherit;
    }

    .annotationEditorLayer .inkEditor .inkEditorCanvas {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        touch-action: none;
    }

.annotationEditorLayer .stampEditor {
    width: auto;
    height: auto;
}

:is(.annotationEditorLayer .stampEditor) canvas {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    top: 0;
    left: 0;
}

:is(.annotationEditorLayer .stampEditor) .noAltTextBadge {
    --csstools-light-dark-toggle--85: var(--csstools-color-scheme--light) #52525e;
    --no-alt-text-badge-border-color: var(--csstools-light-dark-toggle--85, #f0f0f4);
    --csstools-light-dark-toggle--86: var(--csstools-color-scheme--light) #fbfbfe;
    --no-alt-text-badge-bg-color: var(--csstools-light-dark-toggle--86, #cfcfd8);
    --csstools-light-dark-toggle--87: var(--csstools-color-scheme--light) #15141a;
    --no-alt-text-badge-fg-color: var(--csstools-light-dark-toggle--87, #5b5b66);
}

@supports (color: light-dark(red, red)) {
    :is(.annotationEditorLayer .stampEditor) .noAltTextBadge {
        --no-alt-text-badge-border-color: light-dark(#f0f0f4, #52525e);
        --no-alt-text-badge-bg-color: light-dark(#cfcfd8, #fbfbfe);
        --no-alt-text-badge-fg-color: light-dark(#5b5b66, #15141a);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :is(:is(.annotationEditorLayer .stampEditor) .noAltTextBadge) * {
        --csstools-light-dark-toggle--85: var(--csstools-color-scheme--light) #52525e;
        --no-alt-text-badge-border-color: var(--csstools-light-dark-toggle--85, #f0f0f4);
        --csstools-light-dark-toggle--86: var(--csstools-color-scheme--light) #fbfbfe;
        --no-alt-text-badge-bg-color: var(--csstools-light-dark-toggle--86, #cfcfd8);
        --csstools-light-dark-toggle--87: var(--csstools-color-scheme--light) #15141a;
        --no-alt-text-badge-fg-color: var(--csstools-light-dark-toggle--87, #5b5b66);
    }
}

@media screen and (forced-colors: active) {

    :is(.annotationEditorLayer .stampEditor) .noAltTextBadge {
        --no-alt-text-badge-border-color: ButtonText;
        --no-alt-text-badge-bg-color: ButtonFace;
        --no-alt-text-badge-fg-color: ButtonText;
    }
}

:is(.annotationEditorLayer .stampEditor) .noAltTextBadge {
    position: absolute;
    inset-inline-end: 5px;
    inset-block-end: 5px;
    display: inline-flex;
    width: 32px;
    height: 32px;
    padding: 3px;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    z-index: 1;
    border-radius: 2px;
    border: 1px solid var(--no-alt-text-badge-border-color);
    background: var(--no-alt-text-badge-bg-color);
}

:is(:is(.annotationEditorLayer .stampEditor) .noAltTextBadge)::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    -webkit-mask-image: var(--new-alt-text-warning-image);
    mask-image: var(--new-alt-text-warning-image);
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--no-alt-text-badge-fg-color);
}

:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.hidden:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) {
    display: none;
}

:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer {
    width: var(--resizer-size);
    height: var(--resizer-size);
    background: content-box var(--resizer-bg-color);
    border: var(--focus-outline-around);
    border-radius: 2px;
    position: absolute;
}

.topLeft:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    top: var(--resizer-shift);
    left: var(--resizer-shift);
}

.topMiddle:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    top: var(--resizer-shift);
    left: calc(50% + var(--resizer-shift));
}

.topRight:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    top: var(--resizer-shift);
    right: var(--resizer-shift);
}

.middleRight:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    top: calc(50% + var(--resizer-shift));
    right: var(--resizer-shift);
}

.bottomRight:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    bottom: var(--resizer-shift);
    right: var(--resizer-shift);
}

.bottomMiddle:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    bottom: var(--resizer-shift);
    left: calc(50% + var(--resizer-shift));
}

.bottomLeft:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    bottom: var(--resizer-shift);
    left: var(--resizer-shift);
}

.middleLeft:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer) {
    top: calc(50% + var(--resizer-shift));
    left: var(--resizer-shift);
}

.topLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer), .bottomRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer) {
    cursor: nwse-resize;
}

.topMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer), .bottomMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer) {
    cursor: ns-resize;
}

.topRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer), .bottomLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer) {
    cursor: nesw-resize;
}

.middleRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer), .middleLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer) {
    cursor: ew-resize;
}

.topLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer), .bottomRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer) {
    cursor: nesw-resize;
}

.topMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer), .bottomMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer) {
    cursor: ew-resize;
}

.topRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer), .bottomLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer) {
    cursor: nwse-resize;
}

.middleRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer), .middleLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer) {
    cursor: ns-resize;
}

:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="90"],[data-main-rotation="90"] [data-editor-rotation="0"],[data-main-rotation="180"] [data-editor-rotation="270"],[data-main-rotation="270"] [data-editor-rotation="180"])) .editToolbar {
    rotate: 270deg;
}

[dir="ltr"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="90"],[data-main-rotation="90"] [data-editor-rotation="0"],[data-main-rotation="180"] [data-editor-rotation="270"],[data-main-rotation="270"] [data-editor-rotation="180"])) .editToolbar) {
    inset-inline-end: calc(0px - var(--editor-toolbar-vert-offset));
    inset-block-start: 0;
}

[dir="rtl"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="90"],[data-main-rotation="90"] [data-editor-rotation="0"],[data-main-rotation="180"] [data-editor-rotation="270"],[data-main-rotation="270"] [data-editor-rotation="180"])) .editToolbar) {
    inset-inline-end: calc(100% + var(--editor-toolbar-vert-offset));
    inset-block-start: 0;
}

:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="180"],[data-main-rotation="90"] [data-editor-rotation="90"],[data-main-rotation="180"] [data-editor-rotation="0"],[data-main-rotation="270"] [data-editor-rotation="270"])) .editToolbar {
    rotate: 180deg;
    inset-inline-end: 100%;
    inset-block-start: calc(0px - var(--editor-toolbar-vert-offset));
}

:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="270"],[data-main-rotation="90"] [data-editor-rotation="180"],[data-main-rotation="180"] [data-editor-rotation="90"],[data-main-rotation="270"] [data-editor-rotation="0"])) .editToolbar {
    rotate: 90deg;
}

[dir="ltr"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="270"],[data-main-rotation="90"] [data-editor-rotation="180"],[data-main-rotation="180"] [data-editor-rotation="90"],[data-main-rotation="270"] [data-editor-rotation="0"])) .editToolbar) {
    inset-inline-end: calc(100% + var(--editor-toolbar-vert-offset));
    inset-block-start: 100%;
}

[dir="rtl"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="270"],[data-main-rotation="90"] [data-editor-rotation="180"],[data-main-rotation="180"] [data-editor-rotation="90"],[data-main-rotation="270"] [data-editor-rotation="0"])) .editToolbar) {
    inset-inline-start: calc(0px - var(--editor-toolbar-vert-offset));
    inset-block-start: 0;
}

.basicColorPicker {
    width: 28px;
}

    .basicColorPicker::-moz-color-swatch {
        border-radius: 100%;
    }

    .basicColorPicker::-webkit-color-swatch {
        border-radius: 100%;
    }

.annotationEditorLayer[data-main-rotation="0"] .highlightEditor:not(.free) > .editToolbar {
    rotate: 0deg;
}

.annotationEditorLayer[data-main-rotation="90"] .highlightEditor:not(.free) > .editToolbar {
    rotate: 270deg;
}

.annotationEditorLayer[data-main-rotation="180"] .highlightEditor:not(.free) > .editToolbar {
    rotate: 180deg;
}

.annotationEditorLayer[data-main-rotation="270"] .highlightEditor:not(.free) > .editToolbar {
    rotate: 90deg;
}

.annotationEditorLayer .highlightEditor {
    position: absolute;
    background: transparent;
    z-index: 1;
    cursor: auto;
    max-width: 100%;
    max-height: 100%;
    border: none;
    outline: none;
    pointer-events: none;
    transform-origin: 0 0;
}

:is(.annotationEditorLayer .highlightEditor):not(.free) {
    transform: none;
}

:is(.annotationEditorLayer .highlightEditor) .internal {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: auto;
}

.disabled:is(.annotationEditorLayer .highlightEditor) .internal {
    pointer-events: none;
}

.selectedEditor:is(.annotationEditorLayer .highlightEditor) .internal {
    cursor: pointer;
}

:is(.annotationEditorLayer .highlightEditor) .editToolbar {
    --editor-toolbar-colorpicker-arrow-image: url(images/toolbarButton-menuArrow.svg);
    transform-origin: center !important;
}

.editorParamsToolbar:has(#highlightParamsToolbarContainer) {
    padding: unset;
}

#highlightParamsToolbarContainer {
    gap: 16px;
    padding-inline: 10px;
    padding-block-end: 12px;
}

    #highlightParamsToolbarContainer #editorHighlightThickness {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
        align-self: stretch;
    }

:is(#highlightParamsToolbarContainer #editorHighlightThickness) .editorParamsLabel {
    height: auto;
    align-self: stretch;
}

:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    --csstools-light-dark-toggle--92: var(--csstools-color-scheme--light) #80808e;
    --example-color: var(--csstools-light-dark-toggle--92, #bfbfc9);
}

@supports (color: light-dark(red, red)) {
    :is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker {
        --example-color: light-dark(#bfbfc9, #80808e);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker) * {
        --csstools-light-dark-toggle--92: var(--csstools-color-scheme--light) #80808e;
        --example-color: var(--csstools-light-dark-toggle--92, #bfbfc9);
    }
}

@media screen and (forced-colors: active) {

    :is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker {
        --example-color: CanvasText;
    }
}

:is(:is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker) > .editorParamsSlider[disabled]) {
    opacity: 0.4;
}

:is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker)::before, :is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker)::after {
    content: "";
    width: 8px;
    aspect-ratio: 1;
    display: block;
    border-radius: 100%;
    background-color: var(--example-color);
}

:is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker)::after {
    width: 24px;
}

:is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker) .editorParamsSlider {
    width: unset;
    height: 14px;
}

#highlightParamsToolbarContainer #editorHighlightVisibility {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

:is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider {
    --csstools-light-dark-toggle--93: var(--csstools-color-scheme--light) #8f8f9d;
    --divider-color: var(--csstools-light-dark-toggle--93, #d7d7db);
}

@supports (color: light-dark(red, red)) {
    :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider {
        --divider-color: light-dark(#d7d7db, #8f8f9d);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :is(:is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider) * {
        --csstools-light-dark-toggle--93: var(--csstools-color-scheme--light) #8f8f9d;
        --divider-color: var(--csstools-light-dark-toggle--93, #d7d7db);
    }
}

@media screen and (forced-colors: active) {

    :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider {
        --divider-color: CanvasText;
    }
}

:is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider {
    margin-block: 4px;
    width: 100%;
    height: 1px;
    background-color: var(--divider-color);
}

:is(#highlightParamsToolbarContainer #editorHighlightVisibility) .toggler {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

#altTextSettingsDialog {
    padding: 16px;
}

    #altTextSettingsDialog #altTextSettingsContainer {
        display: flex;
        width: 573px;
        flex-direction: column;
        gap: 16px;
    }

:is(#altTextSettingsDialog #altTextSettingsContainer) .mainContainer {
    gap: 16px;
}

:is(#altTextSettingsDialog #altTextSettingsContainer) .description {
    color: var(--text-secondary-color);
}

:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

:is(:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings) button {
    width: -moz-fit-content;
    width: fit-content;
}

.download:is(:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings) #deleteModelButton {
    display: none;
}

:is(:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings):not(.download) #downloadModelButton {
    display: none;
}

:is(#altTextSettingsDialog #altTextSettingsContainer) #automaticAltText, :is(#altTextSettingsDialog #altTextSettingsContainer) #altTextEditor {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

:is(#altTextSettingsDialog #altTextSettingsContainer) #createModelDescription, :is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings, :is(#altTextSettingsDialog #altTextSettingsContainer) #showAltTextDialogDescription {
    padding-inline-start: 40px;
}

:is(#altTextSettingsDialog #altTextSettingsContainer) #automaticSettings {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

:root {
    --csstools-color-scheme--light: initial;
    color-scheme: light dark;
    --viewer-container-height: 0;
    --pdfViewer-padding-bottom: 0;
    --page-margin: 1px auto -8px;
    --page-border: 9px solid transparent;
    --spreadHorizontalWrapped-margin-LR: -3.5px;
    --loading-icon-delay: 400ms;
    --csstools-light-dark-toggle--99: var(--csstools-color-scheme--light) #0df;
    --focus-ring-color: var(--csstools-light-dark-toggle--99, #0060df);
    --focus-ring-outline: 2px solid var(--focus-ring-color);
}

@supports (color: light-dark(red, red)) {
    :root {
        --focus-ring-color: light-dark(#0060df, #0df);
    }
}

@supports not (color: light-dark(tan, tan)) {

    :root * {
        --csstools-light-dark-toggle--99: var(--csstools-color-scheme--light) #0df;
        --focus-ring-color: var(--csstools-light-dark-toggle--99, #0060df);
    }
}

@media (prefers-color-scheme: dark) {

    :root {
        --csstools-color-scheme--light:;
    }
}

@media screen and (forced-colors: active) {

    :root {
        --pdfViewer-padding-bottom: 9px;
        --page-margin: 8px auto -1px;
        --page-border: 1px solid CanvasText;
        --spreadHorizontalWrapped-margin-LR: 3.5px;
        --focus-ring-color: CanvasText;
    }
}

[data-main-rotation="90"] {
    transform: rotate(90deg) translateY(-100%);
}

[data-main-rotation="180"] {
    transform: rotate(180deg) translate(-100%, -100%);
}

[data-main-rotation="270"] {
    transform: rotate(270deg) translateX(-100%);
}

#hiddenCopyElement,
.hiddenCanvasElement {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    display: none;
}

.pdfViewer {
    --scale-factor: 1;
    --page-bg-color: unset;
    padding-bottom: var(--pdfViewer-padding-bottom);
    --hcm-highlight-filter: none;
    --hcm-highlight-selected-filter: none;
}

@media screen and (forced-colors: active) {

    .pdfViewer {
        --hcm-highlight-filter: invert(100%);
    }
}

.pdfViewer.copyAll {
    cursor: wait;
}

.pdfViewer .canvasWrapper {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

:is(.pdfViewer .canvasWrapper) canvas {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    display: block;
    width: 100%;
    height: 100%;
    contain: content;
}

:is(:is(.pdfViewer .canvasWrapper) canvas) .structTree {
    contain: strict;
}

.detailView:is(:is(.pdfViewer .canvasWrapper) canvas) {
    image-rendering: pixelated;
}

.pdfViewer .page {
    --user-unit: 1;
    --total-scale-factor: calc(var(--scale-factor) * var(--user-unit));
    --scale-round-x: 1px;
    --scale-round-y: 1px;
    direction: ltr;
    width: 816px;
    height: 1056px;
    margin: var(--page-margin);
    position: relative;
    overflow: visible;
    border: var(--page-border);
    background-clip: content-box;
    background-color: var(--page-bg-color, rgb(255 255 255));
}

.pdfViewer .dummyPage {
    position: relative;
    width: 0;
    height: var(--viewer-container-height);
}

.pdfViewer.noUserSelect {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.pdfViewer.removePageBorders .page {
    margin: 0 auto 10px;
    border: none;
}

.pdfViewer.singlePageView {
    display: inline-block;
}

    .pdfViewer.singlePageView .page {
        margin: 0;
        border: none;
    }

.pdfViewer:is(.scrollHorizontal, .scrollWrapped),
.spread {
    margin-inline: 3.5px;
    text-align: center;
}

.pdfViewer.scrollHorizontal,
.spread {
    white-space: nowrap;
}

.pdfViewer.removePageBorders,
.pdfViewer:is(.scrollHorizontal, .scrollWrapped) .spread {
    margin-inline: 0;
}

.spread :is(.page, .dummyPage),
.pdfViewer:is(.scrollHorizontal, .scrollWrapped) :is(.page, .spread) {
    display: inline-block;
    vertical-align: middle;
}

.spread .page,
.pdfViewer:is(.scrollHorizontal, .scrollWrapped) .page {
    margin-inline: var(--spreadHorizontalWrapped-margin-LR);
}

.pdfViewer.removePageBorders .spread .page,
.pdfViewer.removePageBorders:is(.scrollHorizontal, .scrollWrapped) .page {
    margin-inline: 5px;
}

.pdfViewer .page.loadingIcon::after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    display: none;
    transition-property: display;
    transition-delay: var(--loading-icon-delay);
    z-index: 5;
    contain: strict;
}

.pdfViewer .page.loading::after {
    display: block;
}

.pdfViewer .page:not(.loading)::after {
    transition-property: none;
    display: none;
}

.pdfPresentationMode .pdfViewer {
    padding-bottom: 0;
}

.pdfPresentationMode .spread {
    margin: 0;
}

.pdfPresentationMode .pdfViewer .page {
    margin: 0 auto;
    border: 2px solid transparent;
}
